1
$(document).ready(function(e) {

    var count=10;
    setInterval(timer, 1000); 
    var green = true;

        function timer()
        {

              if (count < 1)
              {
                 count = 10;
                 setInterval(timer, 1000);

                 green ? green=false : green = true;                    
              }

              $('#tl').empty();

              if(green)
                $('#tl').append(count).css('color', '#090');

              else
                $('#tl').append(count).css('color', '#F00');

              count = count - 1;
        }
});

这是一个简单的红绿灯计数器。起初它运行为 10 9 8 7 6 5 4 3 2 1,下一次它变成 10 8 6 4 2 0,然后是 10 7 4 1

4

2 回答 2

0

我意识到@cherniv 已经给出了答案,这是原始代码中的一个错字,但它有点想知道为什么它会像你说的那样给出

起初它运行为 10 9 8 7 6 5 4 3 2 1,下一次它变成 10 8 6 4 2 0,然后是 10 7 4 1

所以基本上你正在做一个函数调用函数之类的事情(几乎像递归一样,但当然 javascript 上下文使它不同)。该函数setInterval(timer, 1000)再次从其内部被调用。

所以第一次它会深入到 10 个级别,给你

10 9 8 7 6 5 4 3 2 1

下一次当count < 1是真的时setInterval(timer, 1000),已经在后台运行的函数(可以这么说)几乎立即触发,两者之间的时间差很小(因为它们也开始以相同的方式触发)

因此,这导致counter变量减少2 而不是 1,相差很小。给你

10 8 6 4 2 0

依此类推,下一个间隔依次减小。

希望这有助于理解为什么它的行为方式:)

于 2013-08-15T09:57:05.153 回答
0

您不需要多次创建/设置它:

     if (count < 1)
         {
             count = 10;
             // setInterval(timer, 1000); < -- remove this line

             green ? green=false : green = true;                    
         }
于 2013-08-15T09:34:01.340 回答