jQuery延遲隊列

我想推遲像CSS這樣的事情發生，但這種方法不會工作。關於如何推遲任務的任何想法。jQuery延遲隊列

$(function() { 
    $('.btn').click(function() { 
    $('.divOne').animate({"left": "+=400px"}, "fast").delay(800).css("background-color","yellow"); 
    }); 
});

來源

2010-07-15 ThomasReggi

您可以使用.queue()堅持它的默認動畫（fx）隊列，像這樣：

$('.btn').click(function() { 
    $('.divOne').animate({"left":"+=400px"}, "fast").delay(800).queue(function(n) { 
    $(this).css("background-color","yellow"); 
    n(); //call next function in the queue, needed if you animate later! 
    }); 
});

You can test it here，這一切確實是堅持在使用.queue(function(n))的fx隊列中，n是下一個函數在隊列中，所以我們叫它，例如，如果你沒有做到這一點，並在它後面添加任何動畫，它只是不會運行，因爲t他的下一個功能或.dequeue()未被調用。

來源

2010-07-15 22:16:43

'n'實際上並不是queue中的下一個函數，它是一個匿名函數，它調用'dequeue（）'，有效地調用隊列中的下一個函數，yes .... – gnarf 2010-07-15 22:24:09

@gnarf - 語義的問題我想，當你遵循方法鏈時，匿名函數*是隊列中的下一個，即使不在隊列數組本身中，它也是隊列中每個其他函數的* next函數。:) – 2010-07-15 22:31:43

touché;）我承認... – gnarf 2010-07-15 22:33:01

也許在動畫中使用回調函數。一旦動畫完成，使用一個setTimeout()

$(function() { 
    $('.btn').click(function() { 
    $('.divOne').animate({"left": "+=400px"},"fast", function() { 
     var $elem = $(this); 
     setTimeout(function() { 
      $elem.css('background-color','yellow'); 
     }, 800); 
    }) 
});

這可能在語法上不完美。

來源

2010-07-15 22:18:31

不要傳遞一個字符串setTimeout！它應該看起來像這樣：'setTimeout（function（）{$（'。div.one'）。css（'background-color'，'yellow'）}，800）;' – 2010-07-15 22:22:54

我更新了你的答案，這是setTimeout的邪惡'eval'ed字符串參數，並且還將其中的動畫元素存儲在回調函數中，因此您不必通過jQuery DOM選擇器再次搜索它。 – gnarf 2010-07-15 22:25:49

jQuery延遲隊列

回答

相關問題