Перебор массива кнопкой
Доброго времени суток!
Есть код: <script> a = new Array(); a[0]='зима'; a[1]='весна'; a[2]='лето'; a[3]='осень'; var i; i = a[0]; function schet(){ i = i ; document.getElementById('output').value = i; } </script> <input type="button" value="Следующий" onClick="schet()"> Текст: <input id="output" type="text"> Подскажите пожалуйста, как сделать чтобы при нажатии на кнопку "Следующий", в текстовом поле каждый раз выводилось следующее время года? |
<script> a = []; a[0]='зима'; a[1]='весна'; a[2]='лето'; a[3]='осень'; var i; i = 0; function schet(){ document.getElementById('output').value = a[i]; if (i == a.length -1) { i = 0; } else { i++ } } </script> <input type="button" value="Следующий" onclick="schet()"> Текст: <input id="output" type="text"> |
А я ведь что то такое пытался попробовать, но не получилось)) Спасибо большое!
|
<script> var i = 0; var arr = ['зима', 'весна', 'лето', 'осень']; function schet() { document.getElementById('output').value = arr[i++ % arr.length]; } </script> <input type="button" value="Следующий" onclick="schet()">Текст: <input id="output" type="text"> :) |
:)
<input type="button" value="Следующий">Текст: <input id="output" type="text"> <script> var arr = ['зима', 'весна', 'лето', 'осень'], iterator = arr.keys(); document.querySelector("input").addEventListener("click", function () { var next = iterator.next().value; if ( !next) { iterator = arr.keys(); next = iterator.next().value; } this.nextElementSibling.value = arr[next]; }); </script> |
А как сделать чтобы текст кроме кнопки еще и сам менялся рандомно при обновлении страницы? И желательно без поля input.
Рандомно получается такой код: <script> a = new Array(4); a[0]='зима'; a[1]='весна'; a[2]='лето'; a[3]='осень'; h = Math.round((Math.random()*3)); document.write(a[h]); </script> И нужно еще добавить кнопку как в верхнем варианте: var i; i = 0; function schet(){ document.getElementById('output').value = a[i]; if (i == a.length -1) { i = 0; } else { i++ } } </script> <input type="button" value="Следующий" onclick="schet()">Но без поля input |
<html> <head> </head> <body> <input type="button"> <script> a="зима весна лето осень".split(" ") i = Math.round((Math.random()*3)) b=document.querySelector("input") b.value = a[i] b.onclick=function(){ if(i==a.length-1) i=-1 this.value = a[++i]; } </script> </body> </html> |
Спасибо! Работает, но маленько не так, как хотелось бы... Дело в том, что вместо времени года может быть предложение и не три, а гораздо больше. Поэтому желательно именно в таком виде:
a = new Array(4); a[0]='зима'; a[1]='весна'; a[2]='лето'; a[3]='осень'; И чтобы значения выводились не в кнопке и не в текстовом поле, а просто как чистый текст. Вот ссылка, как должно примерно работать, но там у меня кнопка пропадает после нажатия, и если последнее слово зима, то кнопка не работает... Ссылка: http://learn.javascript.ru/play/DMEBac |
Цитата:
|
|
Спасибо за подсказку. Вобщем обошелся без document.write. Получился такой код:
<input id="output" type="text"> <input type="button" value="Следующий" onclick="schet()"> <script language="JavaScript"> a = new Array(4); a[0] = 'Зима'; a[1] = 'весна'; a[2] = 'лето'; a[3] = 'осень'; i = Math.round((Math.random()*3)) b=document.querySelector("input") b.value = a[i] function schet(){ document.getElementById('output').value = a[i]; if(i==a.length-1) i=-1 this.value = a[++i]; } </script> В итоге все работает, но когда вставляю код на сайт, то кнопка работает, а рандом нет( Почему так? |
Получилось! Исправил
b=document.querySelector("input") на b=document.getElementById('output') Всем спасибо!) |
Друзья! Снова вопрос. Поставил код на сайт. При обновлении страницы рандом работает как надо. А вот кнопка следующий после загрузки страницы при первом нажатии не срабатывает. Вот код:
<div id="div_1"></div> <input type="button" value=">>>" onclick="schet()"style="margin: 5px 0px 0px 0px;"> <script language="JavaScript"> a = new Array(8); a[0] = 'Первый'; a[1] = 'Второй'; a[2] = 'Третий'; a[3] = 'Четвертый'; a[4] = 'Пятый'; a[5] = 'Шестой'; a[6] = 'Седьмой'; a[7] = 'Восьмой'; i = Math.round((Math.random()*7)) b=document.getElementById('div_1') b.innerHTML=a[i]; function schet(){ b=document.getElementById('div_1') b.innerHTML=a[i]; if(i==a.length-1) i=-1 this.value = a[++i]; } </script> |
Giyas,
:cray: <!DOCTYPE HTML> <html> <head> <title>Untitled</title> <meta charset="utf-8"> </head> <body> <div id="div_1"></div> <input type="button" value=">>>" onclick="schet()"style="margin: 5px 0px 0px 0px;"> <script> var a = [ 'Первый', 'Второй', 'Третий', 'Четвертый', 'Пятый', 'Шестой', 'Седьмой', 'Восьмой' ], l = a.length, i = Math.ceil((Math.random() * l)), b = document.getElementById('div_1'); function schet() { b.innerHTML = a[++i % l]; }; schet() </script> </body> </html> |
рони,
Спасибо большое! Все получилось!) |
Часовой пояс GMT +3, время: 12:05. |