<HTML>
<HEAD>
<TITLE>Test...</TITLE>
</HEAD>
<BODY>
<DIV id="id1">Блок 1</DIV><HR>
<DIV id="id2">Блок 2</DIV><HR>
<DIV id="id3">Блок 3</DIV><HR>
</BODY>
<SCRIPT language="javascript">
var tmr;
for (I=0;I<4;I++){
ID="id"+I;
clearTimeout(tmr);
tmr=setTimeout("document.getElementById(ID).style.color='red';",2000);
//clearTimeout(tmr);
}
</SCRIPT>
</HTML>
setTimeout / clearTimeout ...
Пример кода:
Почему-то в красный цвет перекрашивается только "Блок 3".
Страницу можно посмотреть здесь.
Код:
Почему-то в красный цвет перекрашивается только "Блок 3".
Страницу можно посмотреть здесь.
Код:
var tmr = setTimeout(
function () {
for (var i = 1; i < 4; i++) {
document.getElementById("id"+i).style.color = 'red';
}
}, 2000);
function () {
for (var i = 1; i < 4; i++) {
document.getElementById("id"+i).style.color = 'red';
}
}, 2000);
Спасибо,но вообще-то нужно было,чтобы цвет строк менялся последовательно с задержкой.
А почему не работает мой скрипт должным образом(меняется цвет только последней строки,а первые две пропускаются)?
А почему не работает мой скрипт должным образом(меняется цвет только последней строки,а первые две пропускаются)?
Код:
<HTML>
<HEAD>
<TITLE>Test...</TITLE>
</HEAD>
<BODY>
<DIV id="id1">Блок 1</DIV><HR>
<DIV id="id2">Блок 2</DIV><HR>
<DIV id="id3">Блок 3</DIV><HR>
</BODY>
<SCRIPT language="javascript">
var tmr;
var i = 0;
var interval = setInterval(setStyle, 2000);
function setStyle()
{
i++;
var ID = "id" + i;
document.getElementById(ID).style.color = 'red';
if (i == 3)
clearInterval(interval);
}
</SCRIPT>
</HTML>
<HEAD>
<TITLE>Test...</TITLE>
</HEAD>
<BODY>
<DIV id="id1">Блок 1</DIV><HR>
<DIV id="id2">Блок 2</DIV><HR>
<DIV id="id3">Блок 3</DIV><HR>
</BODY>
<SCRIPT language="javascript">
var tmr;
var i = 0;
var interval = setInterval(setStyle, 2000);
function setStyle()
{
i++;
var ID = "id" + i;
document.getElementById(ID).style.color = 'red';
if (i == 3)
clearInterval(interval);
}
</SCRIPT>
</HTML>
И всё-же,почему не работает setTimeout?
Вот ещё пример:
onmouseover работает,а функция setTimeout нет. В FireFox в консоли JavaScript пишется,что в строке 7 переменная trid не определена(not defined).
Вот ещё пример:
Код:
<HTML>
<HEAD>
<TITLE>Test</TITLE>
<SCRIPT>
function mOver(trid){
document.getElementById(trid).style.display="block";
tmr=setTimeout("document.getElementById(trid).style.display='none'",2000)
}
</SCRIPT>
</HEAD>
<BODY>
<TABLE border="1">
<TR id="tr1"><TD>Cтолбец 1<TD>Столбец 2</TR>
<TR id="tr2" onmouseover="mOver('tr3')"><TD colspan="2">tr2 caofjweojrovovb</TR>
<TR id="tr3" style="display:none;"><TD>Ячейка 1<TD>Ячейка 2</TR>
</TABLE>
</BODY>
</HTML>
<HEAD>
<TITLE>Test</TITLE>
<SCRIPT>
function mOver(trid){
document.getElementById(trid).style.display="block";
tmr=setTimeout("document.getElementById(trid).style.display='none'",2000)
}
</SCRIPT>
</HEAD>
<BODY>
<TABLE border="1">
<TR id="tr1"><TD>Cтолбец 1<TD>Столбец 2</TR>
<TR id="tr2" onmouseover="mOver('tr3')"><TD colspan="2">tr2 caofjweojrovovb</TR>
<TR id="tr3" style="display:none;"><TD>Ячейка 1<TD>Ячейка 2</TR>
</TABLE>
</BODY>
</HTML>
onmouseover работает,а функция setTimeout нет. В FireFox в консоли JavaScript пишется,что в строке 7 переменная trid не определена(not defined).
Если в IE работает, а в FF нет, то советую почитать про различия в моделях событий в этих браузерах. Проблема скорее всего в этом.
Да нет,в IE тоже не работает(в строке состояния пишет "ошибка на странице").
А все потому, что документацию читать нужно.
Цитата:
setTimeout
Вычисляет выражение или вызывает функцию по истечении специфицированного количества миллисекунд.
....
Описание
Метод setTimeout вычисляет выражение или вызывает функцию по истечении специфицированного количества времени. Он не выполняется повторно. Например, если метод setTimeout специфицирует 5 секунд, через пять секунд вычисляется выражение или вызывается функция, но не каждые пять секунд. Для выполнения повторяющихся таймаутов используйте метод setInterval.
setTimeout не нарушает выполнение скрипта. Скрипт продолжается сразу после выполнения метода (не ожидая повторения интервала). Его вызов просто откладывает будущее событие.
Вычисляет выражение или вызывает функцию по истечении специфицированного количества миллисекунд.
....
Описание
Метод setTimeout вычисляет выражение или вызывает функцию по истечении специфицированного количества времени. Он не выполняется повторно. Например, если метод setTimeout специфицирует 5 секунд, через пять секунд вычисляется выражение или вызывается функция, но не каждые пять секунд. Для выполнения повторяющихся таймаутов используйте метод setInterval.
setTimeout не нарушает выполнение скрипта. Скрипт продолжается сразу после выполнения метода (не ожидая повторения интервала). Его вызов просто откладывает будущее событие.
Так что для начала стоит ознакомиться с документацией, а потом исходя из этого написать требуемую логику работы на бумаге, если уж на уровне исходного кода с ходу не получается.
Кстати, дабы не быть обвиненым новичками в незнании (типа такой умный советовать, напиши код) привожу код, хотя и надеюсь, что автор и сам догадается как решить свою задачу.
Код:
[color=#f5f5ff]<HTML>
<HEAD>
<TITLE>Test...</TITLE>
</HEAD>
<BODY>
<DIV id="id1">Блок 1</DIV><HR>
<DIV id="id2">Блок 2</DIV><HR>
<DIV id="id3">Блок 3</DIV><HR>
</BODY>
<SCRIPT language="javascript" type="text/javascript">
var i = 1;
var timerID = setInterval("if(i>2){clearInterval(timerID);};document.getElementById('id'+i).style.color='red';i++;",2000);
</SCRIPT>
</HTML>[/COLOR]
.
Код:
[color=#f5f5ff]<HTML>
<HEAD>
<TITLE>Test...</TITLE>
</HEAD>
<BODY>
<DIV id="id1">Блок 1</DIV><HR>
<DIV id="id2">Блок 2</DIV><HR>
<DIV id="id3">Блок 3</DIV><HR>
</BODY>
<SCRIPT language="javascript" type="text/javascript">
var i = 1;
var timerID = setInterval("if(i>2){clearInterval(timerID);};document.getElementById('id'+i).style.color='red';i++;",2000);
</SCRIPT>
</HTML>[/COLOR]
.
Цитата: FIRESTARTER
И всё-же,почему не работает setTimeout?
Метод setTimeout - это метод глобального объекта (window в браузерах), то есть эта функция, разбирая переданный ей текст, "видит" только идентификаторы глобального кода вокруг себя (непосредственно свойства/вары/имена функций) не с той точки откуда она вызвана, а с той, где она условно говоря записана. Вызов же может быть сделан откуда угодно, например, из функции:
Код:
(function (param){
setTimeout('alert(param)', 2000); // error
})(1);
setTimeout('alert(param)', 2000); // error
})(1);
В этом случае возникает ошибка, т.к. функция setTimeout не может найти идентификатор с именем param. В глобальном коде такого идентификатора нет, он жил в функции и сразу же умер после выхода из неё. Наоборот, будь у нас глобальная переменная с таким именем, ошибка не возникла бы:
Код:
var param = 0;
(function (param){
setTimeout('alert(param)', 2000); // 0
})(1);
(function (param){
setTimeout('alert(param)', 2000); // 0
})(1);
Но раз первым аргументом в setTimeout передаётся текст, а в функцию передаётся примитив, то мы могли бы нужный текст сконструировать прямо на месте:
Код:
(function (param){
setTimeout('alert('+param+')', 2000); // 1
})(1);
setTimeout('alert('+param+')', 2000); // 1
})(1);
Исходя из этого, ваш вызов во втором примере должен выглядеть следующим образом:
Код:
setTimeout("document.getElementById('"+trid+"').style.display='none'", 1000);
Кроме текста, на месте первого аргумента в setTimeout может стоять функция, соответственно возникнет замыкание (closure), которое запомнит своё лексическое окружение (параметры, переменные, ...), например:
Код:
(function (param){
setTimeout(function(){alert(param)}, 2000); // 1
})(1);
setTimeout(function(){alert(param)}, 2000); // 1
})(1);
По сути задержек, надо понимать, что это отложенное исполнение от точки вызова (ноль) на некое количество миллисекунд. Если мы будем крутить циклы и на каждом обороте вызывать setTimeout некой процедуры с одним и тем же временем задержки, то все процедуры по сути выполнятся в одно и то же время, так как между циклами (вызовами) время ничтожно мало. это я к вашему первому примеру. Поэтому само собой для повторяющихся с определённой частотой действий нужно использовать метод setInterval. Если же очень хочется использовать setTimeout (не рекомендую), то как вариант просто меняйте время задержки на каждом обороте:
Код:
for (var i = 1; i < 4; i++) setTimeout("document.getElementById('id" + i + "').style.color='red'", 2000 * i);