Question

我需要关闭和打开一个元素。这有效，但我不喜欢这些代码。这样做有什么好办法吗？

setTimeout(function(){
  toggle();
  setTimeout(function(){
    toggle();
    setTimeout(function(){
      toggle();
      setTimeout(function(){
        toggle();
      }, 100);
    }, 100);
  }, 100);
}, 100);

如果有帮助，我也在使用jQuery。

Answer 1

function toggle_multiple(n)
{
    var toggled = 0;
    function toggle_one_time()
    {
        toggle();
        toggled += 1;
        if (toggled <= n)
            setTimeout(toggle_one_time, 100);
    }
    toggle_one_time();
}

只需致电toggle_multiple(4)。

Answer 2

递归方法：

function multiTimeoutCall (callback, delay, times) {
    if (times > 0){
      setTimeout(function () {
        callback();
        multiTimeoutCall (callback, delay, times - 1);
      }, delay);
    }
}

用法：

multiTimeoutCall (toggle, 100, 4);

编辑：另一种方法，没有填写调用堆栈：

function multiTimeoutCall (callback, delay, times) {
  setTimeout(function action() { // a named function expression
    callback();
    if (--times > 0) {
      setTimeout (action, delay); // start a new timer
    }
  }, delay);
}

我可以使用arguments.callee而不是命名函数表达式，但似乎有一天它会在ECMAScript 5中被弃用...

Answer 3

为什么不使用setInterval？

var toggler = function() {
    if (++self.counter >= self.BLINK_AMOUNT * 2) {
        self.counter = 0;
        window.clearInterval(self.timer);
        return;
    }
    toggle();
};
toggler.BLINK_AMOUNT = 1;
toggler.counter = 0;
toggler.timer = window.setInterval(toggler, 100);

我不记得IE是否在计时器回调中正确实现了自变量 - 如果没有，请改为使用唯一命名的全局变量。

Answer 4

我会使用闪烁效果。对于jquery，有pulsate，希望对你有用。

Answer 5

这是另一个简单版本：

for (var i= 0; i<4; i++)
    setTimeout(toggle, (i+1)*100);

对于较大的数字，间隔可能更合适，但如果只有四次切换，则多次超时都可以。

Answer 6

Generalizing 'unknown's' idea of using setInterval，

function schedule(fn, max, delay)
{
    var counter = 0;
    var interval = setInterval(
        function()
        { 
            if(counter++ === max)
                clearInterval(interval);
            fn();
        }

       , delay);
}

用法：

schedule(toggle, 4, 100);

Answer 7

如果它只是需要闪烁，为什么不使用jQuery动画？我使用以下内容引导用户注意消息。但你可以为任何元素做到这一点 -

$("#message_box").fadeOut(450).fadeIn(350);

如果您想多次，请执行此操作 -

$("#message_box").fadeOut(450).fadeIn(350).fadeOut(450).fadeIn(350);

Answer 8

你可以这样做：

function toggleMany(cnt) {
   toggle();
   if (--cnt >= 0) window.setTimeout('toggleMany('+cnt+')', 100);
}

toggleMany(4);

在javascript中排队setTimeout

8 个答案: