События таймера
|
Автор: Артемьев Сергей Игоревич ICQ: 438856621 email: _spin_@bk.ru |
Одно из замечательных свойств JavaScript - возможность запланировать выполнение произволного кода по истечении заданного интервала времени. Делается это очень просто. Сначала описывается функция, содержащая необходимый код, а затем устанавливается таймер на нужный интервал времени. По истечении этого интервала код будет выполнен автоматически без участия пользователя.
Таймер устанавливается программно при помощи методов setTimeout() или setInterval() объекта window.
<script type="text/javascript" language="javascript">
function runOnce()
{
alert('single alert');
}
function runMultiple()
{
alert('повторяющееся сообщение');
}
// интервал времени задаётся в милисекундах,
// т.е. значение 3000 соответствует 3 секундам
var timerOnce = window.setTimeout("runOnce();", 1000);
var timerMulti = window.setInterval("runMultiple();", 4000);
</script>
При помощи setTimeout() можно эмулировать поведение функции setInterval(). Для этого необходимо на каждой итерации заново запускать таймер:
<script type="text/javascript" language="javascript">
function runOnce()
{
alert('single alert');
window.setTimeout("runOnce();", 3000);
}
var timerOnce = window.setTimeout("runOnce();", 3000);
</script>
Если таймер больше не нужен - его можно отключить при помощи методов clearTimeout() или clearInterval(). Обе функции имеют одинаковый синтаксис и в качестве параметра принимают ссылку на таймер.
<script type="text/javascript" language="javascript">
var timerMulti;
function runMultiple()
{
if(условие_истинно)
{
// делаем какие-то действия
}
else
window.clearTimeout(timerMulti);
}
timerMulti = window.setTimeout("runMultiple();", 5000);
</script>
Таймеры очень часто используются для предупреждения пользователя о перенаправлении пользователя на новую страницу. Я думаю, вы не раз видели на сайтах надпись "Вы будете перенаправлены на какую-то-страницу через Х секунд" и вместо "Х" - обратный отсчёт секунд.
При помощи таймера такой приём реализуется очень просто, хотя есть возможность сделать это и средствами мета-тегов, но уже без счётчика оставшихся секунд.
<html>
<head>
<title>Страница перенаправления</title>
<script type="text/javascript" language="javascript">
// выставляем длительность ожидания в секундах
var secCount = 10;
function checkExpiration()
{
if(secCount != 0)
{
// если счётчик ещё не обнулился -
// уменьшаем его и снова взводим таймер
secCount -= 1;
document.getElementbyId("counter").innerHTML = secCount + " ";
window.setTimeout("checkExpiration()", 1000);
}
else
{
// счётчик обнулился и можно
// перенаправить страницу
document.location = "target.htm";
}
}
</script>
</head>
<body onload="window.setTimeout('checkExpiration()', 1000);">
страница будет перезагружена через
<span id="counter">
<!-- записываем начальное значение счётчика -->
<script type="text/javascript" language="javascript">
document.write(secCount);
</script>
</span>
секунд
</body>
</html>
Как показывает практика, практически ни один сайт не обходится без таймеров. Часы, летающий или ползающий текст, простая анимация и редиректы - все они основаны на собятиях таймера.
Напоследок стоит отметить, что интервал хоть и задаётся в милисекундах, но точность срабатывания не гарантируется. Погрешность зависит от используемого браузера, мощности компьютера, текущей загрузки процессора и многих других параметров. Обычный человек как правило не замечает задержек, но при выполнения сложных замеров опираться на таймер не стоит.
