Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Вывод случайных элементов из массива в таблицу (https://javascript.ru/forum/misc/40440-vyvod-sluchajjnykh-ehlementov-iz-massiva-v-tablicu.html)

Narm0 05.08.2013 17:54

Вывод случайных элементов из массива в таблицу
 
Добрый день.
Существуют 2 массива. Первый с названием организаций, второй с операцией.

<script>
var arr = ['АвтоМир', 'Авто-Ойл', 'Автоспутник', 'Автотест'];
var arr1 = ['Плановое продление ЭЦП', 'Помощь с отчетом', 'Переустановка'];
</script>


Скрипт для случайной выборки элементов.

<script>
document.write(arr[Math.round(Math.random()*(arr.length-1))]);
</script>


Я смог сделать вывод элементов в таблицу путем копирования ячеек и вставки в них скрипта.

<table>
  <tr>
    <td>
      <script>
        document.write(arr[Math.round(Math.random()*(arr.length-1))]);
      </script>
    </td>
    <td>
      <script>
        document.write(arr1[Math.round(Math.random()*(arr1.length-1))]);
      </script>
    </td>
  </tr>
</table>


Но так как таблица должна быть большая, примерно 200 строк, то этот способ очень громоздкий и ужасный.
Вопрос, можно ли сделать нечто подобное(создание таблицы и вывод случайных элементов в нее) путем нажатия одной кнопки, например

<script>
  onclick = function(){document.getElementById ('ttd').innerHTML = arr[Math.round(Math.random()*(arr.length-1))];}
</script>

deivan 05.08.2013 19:27

наверное, стоит разделить случайную выборку и построение таблицы?..

не очень понял задачу, но есть нужно некий массив "встряхнуть" чтобы он в случайном порядке перепутался, то вот способ из учебника, а потом этот "перетрАхнутый" массив вывести в таблицу построчно обычными методами джаваскрипт.

ksa 06.08.2013 08:55

Цитата:

Сообщение от Narm0
можно ли сделать нечто подобное(создание таблицы и вывод случайных элементов в нее) путем нажатия одной кнопки

Разумеется можно! :D
Как вариант...

<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
function test() {
	var a=[];
	a[0] = ['АвтоМир', 'Авто-Ойл', 'Автоспутник', 'Автотест'];
	a[1] = ['Плановое продление ЭЦП', 'Помощь с отчетом', 'Переустановка'];
	var n=10;
	var l=[a[0].length,a[1].length];
	var ot=document.getElementById('test');
	var or,oc,k;
	for (var i=0; i<n; i++) {
		or=ot.insertRow(-1);
		for (var j=0; j<2; j++) {
			oc=or.insertCell(j);
			k=Math.random()*(l[j]-1);
			k=Math.round(k);
			k=a[j][k];
			oc.innerHTML=k;
		};
	};
};
</script>
</head>
<body>
<table id='test' border='1'>
</table>
<button onclick='test();'>Go</button>
</body>
</html>

Narm0 06.08.2013 09:01

Всем спасибо, буду пробовать.

Narm0 06.08.2013 09:54

все получилось так как надо, только вот как сделать так, чтобы таблица не рисовалась вниз при каждом нажатии на кнопку. Хотелось бы, чтобы новые результаты генерировались в таблице определенного размера, например, 2 на 50(2 колонки, 50 строк). Т.е. при нажатии на кнопку изменялось только содержимое таблицы (случайным образом).

ksa 06.08.2013 09:56

Цитата:

Сообщение от Narm0
Хотелось бы ...

Хотения свои чем подкрепишь? :D

Narm0 06.08.2013 10:03

Криками шэфа на тему необходимости данной таблицы=)

ksa 06.08.2013 10:40

Цитата:

Сообщение от Narm0
Криками шэфа на тему необходимости данной таблицы

Скажи ему, что пора раскошеливаться... :D

Narm0 06.08.2013 10:59

Ну да, очень смешно

deivan 06.08.2013 12:05

Коллега имел ввиду, что здесь не принято забесплатно выполнять работу за других.

А вот решить конкретную проблему в коде - пожалуйста. Задавайте вопрос, что и где не получается.


Часовой пояс GMT +3, время: 16:55.