Форум

Y_a__r_i__k · #1 (**permalink**) 01.03.2017, 20:17

Изучаю javascript и решил написать простенький таймер для проверки своих-знаний. Но в каком-то месте допустил ошибку. Пожалуйста помогите мне ее найти

Вот код:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>javascript</title>
	<script type="text/javascript">

var izm;
	var timeg;
	var t;
	function timer(form){
		var ans = form.ans.value;
		var time = form.time.value;
		timeg = time;
		var fail = true;
		if (ans == "sec")
			t = time * 1000;
		else if (ans == "min")
			t = time * 60000;
		else if (ans == "hou")
			t = time * 3600000;
		else{
		alert("вы не указали единицы измерения");
		fail = false;}
		if (fail != false){
			setTimeout( outtimer , t );
			setTimeout( calk , 0);
		}	
	
	function calk (){
		if (timeg >= 3600) {
		var r = Math.floor( timeg / 3600 );
		var e = Math.floor( timeg / 60 % 60);
		var z = (timeg - r * 3600 - e * 60);
		if (e == 0 && z == 0){
			document.getElementById('actt').innerHTML = ("осталось " + r + " часов");
		}else if (e == 0){
			document.getElementById('actt').innerHTML = ("осталось " + r + " часов" + " и " + z + " секунд");
		}else if (z == 0){
			document.getElementById('actt').innerHTML = ("осталось " + r + " минут" + " и " + e + " минут");
		}	
		}
		else if (timeg >= 60 && time < 3600){
		var e = Math.floor( timeg / 60);
		var z = (timeg - e * 60);
        if (z != 0){
        	document.getElementById('actt').innerHTML = ("осталось " + e + " минут" + " и " + z + " секунд");
        }else{
        	document.getElementById('actt').innerHTML = ("осталось " + e + " минут");
        }
    }	else if (timeg < 60 %% timeg >= 0){
    	document.getElementById('actt').innerHTML = ("осталось " + timeg + " секунд");
    }
        timeg --;
        if (timeg < 0){
        	document.getElementById('actt').innerHTML = ("Таймер закончил свое действие");
        }
		setTimeout( calk  , 1000 );
	}
	function outtimer () {
		alert("время закончилось");
	}

</script>
</head>
<body>
	<form action="" id = "form">
		<hr>
		<label for="time">Время</label>
		<input type="text" placeholder="Введите время для таймера" name = "time" id = "time">
		<br>
		<hr>
		<p>В каких еденицах измерения вы написали время?</p>
		<label for="sec">Секунды</label>
		<input type="radio" name="ans" id="sec" value="sec">
		<label for="min">Минуты</label>
		<input type="radio" name="ans" id="min" value="min">
		<label for="hou">Часы</label>
		<input type="radio" name="ans" id="hou" value="hou">
		<br>
		<hr>
		<input type="button" onclick="timer(getElementById('form'))" value="Активировать таймер">
		<hr>
		<span id = "actt">Вы не активировали таймер</span>
		<hr>
	</form>
</body>
</html>

рони · #2 (**permalink**) 01.03.2017, 20:24

Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[js]
... ваш код...
[/js]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

Eschaton · #3 (**permalink**) 01.03.2017, 21:21

Вы бы хоть научились инструментами отладки пользоваться в браузере своём, он же там всё понятно расписывает, что и где не так. И это одно из первых тем, которые нужно изучить при написании кода, потрачено будет минут 20-30, а пользы на всю жизнь.
Откройте консоль, посмотрите ошибку и исправьте

Diphenyl Oxalate · #4 (**permalink**) 02.03.2017, 00:51

Например

44       }   else if (timeg < 60 %% timeg >= 0){

%% вместо &&

рони · #5 (**permalink**) 02.03.2017, 00:58

Y_a__r_i__k,
ещё строки 22 нет, и строки 5, 6 в ie работать не будут.

Paguo-86PK · #6 (**permalink**) 02.03.2017, 07:47

<!DOCTYPE html>
<html lang='en'>
<head>
	<meta charset='UTF-8'>
	<title>javascript</title>
	<script type='text/javascript'>
Number.prototype.finish = function(fmt) {
	var	n = this;
	fmt = fmt.split(/[-:]/);
	switch(fmt[0]) {
	case "ru":
		n += 79;
		n %= 100;
		n = n > 83 || n % 10 > 3 ? 2 : n % 10 ? 4 : 3;
		return	"" + this + fmt[1] + fmt[n];
	}
	return	"" + this;
}
var izm;
var timeg;
var t;
function timer(form) {
	var ans = form.ans.value;
	var time = form.time.value;
	timeg = time;
	var fail = true;
	if(ans == "sec")
		t = time * 1000;
	else
	if(ans == "min")
		t = time * 60000;
	else
	if(ans == "hou")
		t = time * 3600000;
	else {
		alert("вы не указали единицы измерения");
		fail = false;
	}
	if(fail != false) {
		setTimeout(outtimer, t);
		setTimeout(calk, 0);
		timeg = t / 1000;
	}
}
function calk() {
	if(timeg >= 0) {
		var r = Math.floor(timeg / 3600);
		var e = Math.floor(timeg / 60 % 60);
		var z = (timeg - r * 3600 - e * 60);
		var s = [];
		if(r > 0)
			s.push(r.finish("ru: час-ов--а"));
		if(e > 0)
			s.push(e.finish("ru: минут--а-ы"));
		if(z > 0)
			s.push(z.finish("ru: секунд--а-ы"));
		document.getElementById("actt").innerHTML = "осталось " + s.join(" и ");
	}
	timeg --;
	if(timeg < 0)
		document.getElementById("actt").innerHTML = ("Таймер закончил свое действие");
	setTimeout(calk, 1000);
}
function outtimer() {
	alert("время закончилось");
}
</script>
</head>
<body>
	<form action='' id=form>
		<hr>
		<label for=time>Время</label>
		<input type=text placeholder='Введите время для таймера' name=time id=time />
		<br>
		<hr>
		<p>В каких еденицах измерения вы написали время?</p>
		<label for=sec>Секунды</label>
		<input type=radio name=ans id=sec value='sec' />
		<label for=min>Минуты</label>
		<input type=radio name=ans id=min value='min' />
		<label for=hou>Часы</label>
		<input type=radio name=ans id=hou value='hou' />
		<br>
		<hr>
		<input type=button onclick='timer(getElementById("form"))' value='Активировать таймер' />
		<hr>
		<span id=actt>Вы не активировали таймер</span>
		<hr>
	</form>
</body>
</html>

Diphenyl Oxalate · #7 (**permalink**) 02.03.2017, 13:00

При запуске таймера несколько раз интервалы накладываются. Надо очищать.

<input value='5' id='t'>
<input type='button' value='Go' onclick='clearInterval(window.k);r.innerHTML=t.value;k=setInterval(()=>!--r.innerHTML&&(clearInterval(k)||alert("Done!")),1e3)'>
<div id='r'></div>

Форум

Справочник

Discord чат

Курсы javascript