警報器首先運行？

Question

我有一些jQuery/JS下面。首先要運行的是最後的警告框。

$(document).ready(function() { 
    $("#id1 img , .msg").stop().animate(
     { width: '300px', height: '300px'}, 
     { duration: 'slow', easing: 'easeInSine' }).pause(3000); 

    $(".msg").animate(
     { width: '50px', height: '50px' }, 
     { duration: 498, easing: 'easeOutSine' }); 
    $("#id1 img").animate(
     { width: '50px', height: '50px' }, 
     { duration: 500, easing: 'easeOutSine' }); 

    $("#id1 img , .msg").animate(
     { width: '300px',height: '300px'}, 
     { duration: 'slow', easing: 'easeInSine' }).pause(3000); 

    alert('eh?'); 
}); 

我有一個easing插件。

如果我運行此警報將顯示，然後第一個動畫將發生在後臺，但不會顯示。它只會出現在最終尺寸。

不應該在所有動畫結束時運行警報嗎？

任何人都可以解釋爲什麼發生這種情況？

Answer 1

這個暫停插件表示它「在隊列中保存所有內容」達指定的時間。它實際上不會暫停執行（JavaScript中沒有睡眠）。

所以，這正是預期的事情，警報將首先顯示。

Answer 2

jQuery animate在動畫製作時不會阻止執行。相反，只有當你調用語句$（）。animate被調用時纔會排隊。

因此，您的alert（）語句被稱爲「第一個」。但事實上，動畫語句在alert（）之前被調用，只有alert（）在動畫完成之前阻止了執行。

Answer 3

正如其他評論者所說，動畫方法是非阻塞的，因此這是正確的行爲。如果您希望在動畫結束時調用警報，請查看動畫方法的回調參數。該文檔指出：「動畫完成時要執行的函數，針對每個元素執行一次動畫。」

http://docs.jquery.com/Effects/animate

Answer 4

就像在你有

$(document).ready(function(){ 

這功能代碼的開頭指出，後該文件已準備就緒，加載下面的功能。 因此，在您正在運行的動畫結束時，您需要添加另一個函數，告訴它在動畫完成後運行。 下面是一個例子：

$(document).ready(function(){ 
    $("button").click(function(){ 
    $("p").animate({width:25},3000,function(){ 
     alert("The paragraph has been animated"); 
    }); 
    }); 
    }); 

當按鈕被點擊時，所有p元件具有其寬度皺縮到25pixels一段3秒（jQuery的在millisecons閱讀），並且一旦該完成時，它運行的功能提醒「該段已被動畫」。 希望這有助於。