Перейти к контенту

Таймер на кнопке


Рекомендуемые сообщения

Видел пару раз в сети... немогу найти теперь

Хочется сделать при регистрации (когда правила висят) на кнопке таймер. пока минута не пройдёт кнопка не активна. В JS не силён :D

Может кто чрканёт пример, либо ссылку на аналогичное.

Ссылка на комментарий
Поделиться на других сайтах

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<form action="http://mysite.ru/myfile.php" method="post" name="reg" id="reg">
<div id="login">Логин: <input type="text" name="name"></div>
<div id="pass">Пароль: <input type="password" name="pwd"></div>
<div><textarea cols="" rows="" name="pravila">
Тут текст правил, довольно длинный может быть.
</textarea></div>
<div id="butons"><input type="button" name="sbm" value="ОК" onClick="java script:alert('Вам дано 60 секунд для ознакомления с правилами!')" style="color: Silver;"><input type="Reset"></div>
</form>

<script type="text/javascript">
comanda = "document.getElementById('butons').innerHTML = ";
comanda += "'";
comanda += '<input type="submit" name="sbm" value="ОК"><input type="Reset">';
comanda += "'";
setTimeout('eval(comanda)',60000)
</script>
</body>
</html>

Ссылка на комментарий
Поделиться на других сайтах

В принципе что-то вроде этого.

Хотелось бы конечно на кнопке выводить сам таймер..... 5..4..3..2...

А чтоб таймер работал только когда страница активна... это вроде из рода фантастики?

FatCat, благодарю.

Ссылка на комментарий
Поделиться на других сайтах

В принципе что-то вроде этого.

Хотелось бы конечно на кнопке выводить сам таймер..... 5..4..3..2...

Не сложно через setInterval('функция',интервал)

 

 

А чтоб таймер работал только когда страница активна... это вроде из рода фантастики?

Объявляется переменная с количеством секунд. Пишется функция, отнимающая единицу каждую секунду и перезаписывающая батон.

В бодях на онфокус запуск таймера, на онблур стоп таймера. На достижение нуля стоп таймера и перезапись кнопки на сабмит.

 

В общем, не сложно, но муторно.

Ссылка на комментарий
Поделиться на других сайтах

Я именно на JS никогда не писал... опыта - 0.

Буду конечно пробовать. Однако если попадётся случайно такая регистрация - буду благодарен за пример.

PS. Далеко не на 1 форуме видел подобное... сейчас найти не могу.. хе.

Ссылка на комментарий
Поделиться на других сайтах

Я именно на JS никогда не писал... опыта - 0.

Сделал с таймером:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<form action="http://mysite.ru/myfile.php" method="post" name="reg" id="reg">
<div id="login">Логин: <input type="text" name="name"></div>
<div id="pass">Пароль: <input type="password" name="pwd"></div>
<div><textarea cols="" rows="" name="pravila">
Тут текст правил, довольно длинный может быть.
</textarea></div>
<div id="butons"><input type="button" name="sbm" value="Подождите 1 минуту" onClick="alert('Вам дано 60 секунд для ознакомления с правилами!')" style="color: Gray;"><input type="Reset"></div>
</form>

<script type="text/javascript">
timeleft = 60;
function decrim(){
timeleft -= 1;
document.getElementById('butons').innerHTML = '<input type="button" name="sbm" value="Подождите '+timeleft+' секунд" onClick="endtime()" style="color: Gray;"><input type="Reset">';
if(timeleft == 0){
clearInterval(hs)
document.getElementById('butons').innerHTML = '<input type="submit" name="sbm" value="ОК"><input type="Reset">';
}
}

function endtime(){
alert('Вам осталось ждать '+timeleft+' секунд.\nЗаймите это время чтением правил!')
}

hs = setInterval("decrim()",1000)
</script>
</body>
</html>

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

Ссылка на комментарий
Поделиться на других сайтах

Я именно на JS никогда не писал... опыта - 0.

Сделал с таймером:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<form action="http://mysite.ru/myfile.php" method="post" name="reg" id="reg">
<div id="login">Логин: <input type="text" name="name"></div>
<div id="pass">Пароль: <input type="password" name="pwd"></div>
<div><textarea cols="" rows="" name="pravila">
Тут текст правил, довольно длинный может быть.
</textarea></div>
<div id="butons"><input type="button" name="sbm" value="Подождите 1 минуту" onClick="alert('Вам дано 60 секунд для ознакомления с правилами!')" style="color: Gray;"><input type="Reset"></div>
</form>


<script type="text/javascript">
timeleft = 60;
function decrim(){
timeleft -= 1;
document.getElementById('butons').innerHTML = '<input type="button" name="sbm" value="Подождите '+timeleft+' секунд" onClick="endtime()" style="color: Gray;"><input type="Reset">';
if(timeleft == 0){
clearInterval(hs)
document.getElementById('butons').innerHTML = '<input type="submit" name="sbm" value="ОК"><input type="Reset">';
}
}

function endtime(){
alert('Вам осталось ждать '+timeleft+' секунд.\nЗаймите это время чтением правил!')
}

hs = setInterval("decrim()",1000)
</script>
</body>
</html>

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

 

извените за тупой вопрос, но куда это вставлять?))

Ссылка на комментарий
Поделиться на других сайтах

Присоединиться к обсуждению

Вы можете ответить сейчас, а зарегистрироваться позже. Если у вас уже есть аккаунт, войдите, чтобы ответить от своего имени.

Гость
Ответить в этой теме...

×   Вы вставили отформатированный текст.   Удалить форматирование

  Допустимо не более 75 смайлов.

×   Ваша ссылка была автоматически заменена на медиа-контент.   Отображать как ссылку

×   Ваши публикации восстановлены.   Очистить редактор

×   Вы не можете вставить изображения напрямую. Загрузите или вставьте изображения по ссылке.

Зарузка...
×
×
  • Создать...

Важная информация

Находясь на нашем сайте, вы соглашаетесь на использование файлов cookie, а также с нашим положением о конфиденциальности Политика конфиденциальности и пользовательским соглашением Условия использования.