Как передать значение из формы
Здравствуйте. Есть форма
<form action=""> <input type="text" name="" id="number" value="1000"> <input type="submit" value="Задать время" onclick="setTime()"> </form> Как присвоить переменной в js коде значение, введенное в input с id= number? Желательно на примере. |
document.getElementById('number').oninput = function() { var val = this.value; }; |
Что-то не то. Пишет ''undefined".
|
Stroy,
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>JS Bin</title> </head> <body> <form action=""> <input type="text" name="" id="number" value="1000"> <input type="submit" value="Задать время" onclick="setTime()"> </form> <script> function setTime() { var val = document.getElementById('number').value; alert(val); } </script> </body> </html> |
Извините за назойливость, но что-то не получается. Значение присваивается, но при этом не передается в другую функцию
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script> var ms = 1000; var number; var interval; function MP3(){ document.getElementById('player').play(); } function setTime () { number = document.getElementById('number').value; } function SetInterval(){ number = number * ms; interval = window.setInterval(MP3(), number); console.log(number); } function ClearInterval(){ window.clearInterval(interval); } </script> <style type="text/css"> div{ margin: 0 auto; width: 400px; } </style> </head> <body> <div>Музыка <audio id="player" src="DA1.mp3" controls></audio> <form action="mp3.html" > <input type="text" name="numb" id="number" value="10"> <input type="submit" value="Запуск цикла" onclick="setTime()"> <input type="submit" value="Остановка таймера"> </form> </div> <button onclick="SetInterval()" value="">Запуск цикла</button><br> <button onclick="ClearInterval()" value="">Прервать цикл</button> </body> </html> |
Цитата:
|
Уже исправил. Но таймер все равно не работает. В консоли выдает NaN.
|
Stroy,
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script> var ms = 1000; var number; var interval; function MP3(){ document.getElementById('player').play(); } function setTime () { number = document.getElementById('number').value; } function SetInterval(){ !number && setTime(); !+number && (number = 10); number = number * ms; MP3(); ClearInterval(); interval = window.setInterval(MP3, number); } function ClearInterval(){ window.clearInterval(interval); } </script> <style type="text/css"> div{ margin: 0 auto; width: 400px; } </style> </head> <body> <div>Музыка <audio id="player" src="http://boobooka.com/wp-content/uploads/2013/01/moneta.mp3" controls></audio> <form action="mp3.html" onsubmit="return false" > <input type="text" name="numb" id="number" value="10"> <input type="submit" value="установить время цикла" onclick="setTime()"> </form> </div> <button onclick="SetInterval()" value="">Запуск цикла</button><br> <button onclick="ClearInterval()" value="">Прервать цикл</button> </body> </html> |
Всё работает. Но хотелось бы разобраться. Что я делал неправильно?
|
Stroy,
в основном строка 39 и у вас строгий порядок должен быть сначала установка времени -- строка 41 потом всё остальное -- поэтому если кто пропустит куча "защит от дурака" - строки 17 и 18 --- строка 21 защита от повторного запуска интервала |
Цитата:
На самом деле это функция преобразования ввода должна все возвращать нормально, а функция SetInterval() должна ее тупо вызывать каждый раз не думая, как боец. |
Вот так надо:
(function(){ var D=document, ms=1000, interval=null, player=D.getElementById('player'), number=D.getElementById('number'), setTime=function() {return number.value||10;}, MP3=function(){player.play()}, ClearInterval = function(){if(interval) window.clearInterval(interval);interval=null;}, SetInterval=function(){ ClearInterval(); interval=window.setInterval(MP3,setTime()*ms); MP3(); }; })(); Запускать сразу после загрузки хтмля плеера. Или дописать отложенную инициализацию. Умножение на секунду логично перекинуть в ту же функцию преобразования, которую еще надо дополнить проверками на текст (isNaN) и в таком роде. |
kostyanet,
и как ваш код сработает из анонимной функции? пусть как обычно это останется загадкой. |
По кнопке и сработает.
Хотите сказать ТС не сообразит как это сделать, или не осмелится задать вопрос? Ну, то есть, вы-то знаете как это элементарно делается, но изображаете недоумение. Или на самом деле не знаете? |
kostyanet,
По-моему у Рони код выглядит более понятно и логично. Во всяком случае, для новичков. |
kostyanet,
в конце 14 строки добавить обработку событий для нужных элементов? или у вас есть иное решение? |
Цитата:
Да мне-то фиолетово, просто вы сами себя унижаете воображая будто бы сможете поставить кого-то в зависимость от себя. Не можете потому что таких как мы спецов - как грязи. Любой кого вы унасекомите найдет другого кто разберется и все переделает как надо, если оно надо. А когда вы потакаете тупым - называя их новичками - то ваша репутация устаканивается на отметке "для тупых". Понимаете? Ну тогда еще раз. Тупым имеет право быть заказчик и его клиент. А программист не может быть, иначе он не программист. Поэтому никаких новичков не существует. Начал программировать - все, ты программист, иначе не программист и точка. Так вот форум судя по обрамлению и был задуман как площадка для обучения, а не отупления. Но видать тут одни тупые хотят остаться, все остальные походу на русский СО сбежали. |
Цитата:
Не важно, продолжайте отуплять нацию. |
kostyanet,
что такое Цитата:
|
Судя по карме рони и по вашей, 99% этого форума, судя по вашим словам, реально "тупые"... Или дело в Вас?
В любом случае, я не намерен с Вами дискутировать. Разговор закончен. |
Русский СтекОверфлоу - СО.
Цитата:
Ну конечно не имеет, тупизна все равно сдохнет. Просто Рони не знает сколько осталось кодов, а сколько было выкошено под натиском проблем дальнего порядка, которые неизбежно вырастают из окопов как только побеждены проблемы ближнего порядка. "Новички" же как начинают - с простого и им понятного. К тому времени когда их жизнь подводит к модульности, к паттернам, к ооп, к передовой в общем - тылы оказываются завалены несусветными тоннами неуправляемого хлама. Разве в этом рони виноваты? Конечно нет - виноват всегда тот, кто задает вопрос. Но что если он получит другой ответ? |
Так вот на том самом SO отношение к таким "новичкам", в смысле тупым халявщикам - резко негативное. Никто им там не помогает и за них ничего не пишет. А вы господа соискатели кармы - опустили learning curve этого форума ниже плинтуса. Ну что же, видать такова его курвость.
|
рони
Добавил в свой код всего лишь <form action="mp3.html" onsubmit="return false" >оnsubmit ="return false" и у меня все заработало. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script> var ms = 1000; var num; var interval; function MP3(){ document.getElementById('player').play(); } function setTime () { num= document.getElementById('number').value; num = parseInt(num); return num; } console.log(num); function SetInterval(){ num= num* ms; /* if(isNaN(num)) alert("num is NaN"); else*/ interval = window.setInterval(MP3, num); // console.log(num); } function ClearInterval(){ window.clearInterval(interval); num = null; } </script> <style type="text/css"> div{ margin: 0 auto; width: 400px; } </style> </head> <body> <div>Музыка <audio id="player" src="DA1.mp3" controls></audio> <form action="mp3.html" onsubmit="return false" > <input type="text" id="number" value="10"> <input type="submit" value="Запуск цикла" onclick="setTime()"> </form> </div> <button onclick="SetInterval()" value="">Запуск цикла</button><br> <button onclick="ClearInterval()" value="">Прервать цикл</button> </body> </html> |
Stroy,
ок! :) |
Часовой пояс GMT +3, время: 22:55. |