@Dreaded

Почему некорректно отображается переключение времени?

Суть задачи такова, что мне нужно сделать часы с возможностью переключения формата отображения времени с 12 часов на 24 часа. Вот моё решение.

function showtime(param) {
var all=new Date();
var hours=all.getHours();
var minutes=all.getMinutes();
var seconds=all.getSeconds();
var timevalue = ((minutes<10) ? " :0" : " : ") + minutes;
timevalue += ((seconds<10) ? " :0" : " : ") + seconds;
if (param == 24) {
	timevalue = " " + hours + timevalue; 
}
else {
	timevalue = " " + ((hours>12) ? hours-12 : hours) + timevalue; 
	timevalue += (hours>=12) ? " P.M. " : " A.M. ";		
}
document.clock.next.value=timevalue;
timer=setTimeout(function () {showtime(param);}, 1000);
}
</script>


<body bgcolor=F5DEB3 text=8B4513 onLoad="showtime()">
<center>
<H3>Clock</H3>
<form name=clock>
<input type=text name=next size=12 value=' '>
<br>
<input type=button name=format onClick="showtime(24)" value = "24h fromat">
<input type=button name=format onClick="showtime(12)" value = "12h fromat">
</center>
</form>
</body>


Проблема в том, что при переключении на 24 часа, 24 часовой формат мелькает один раз, а потом снова отображается время в формате 12 часов. И так продолжается по кругу. Как это можно поправить?
  • Вопрос задан
  • 49 просмотров
Решения вопроса 1
BRAGA96
@BRAGA96
Вам нужно создать глобальную переменную var timer = 0; и в функции showtime(param) перед вызовом setTimeout чистить таймер clearTimeout(timer)
Полный код
var timer = 0;

function showtime(param) {
	var all=new Date();
	var hours=all.getHours();
	var minutes=all.getMinutes();
	var seconds=all.getSeconds();
	var timevalue = ((minutes<10) ? " :0" : " : ") + minutes;
	timevalue += ((seconds<10) ? " :0" : " : ") + seconds;
	if (param == 24) {
		timevalue = " " + hours + timevalue; 
	}
	else {
		timevalue = " " + ((hours>12) ? hours-12 : hours) + timevalue; 
		timevalue += (hours>=12) ? " P.M. " : " A.M. ";		
	}
	document.clock.next.value=timevalue;
	clearTimeout(timer);
	timer=setTimeout(function () {showtime(param);}, 1000);
}
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы