私のキューはデキューなしで動作しますか？

Question

jqueryドキュメントを何度も読んだことがありますが、デキューメソッドを理解できません。次の例を考えてみましょう：あなたは、このスクリプトを実行するときは、3秒後にqueue火災内部機能することを参照してくださいね私はdequeuedそれを持っていない

var div = $(".div"); 
 

 

 

 
div.animate({ 
 
    height: "200px" 
 
}, 3000).queue(function(){ 
 
    console.log("3 seconds passed and I show off without dequeue"); 
 
});

div { 
 
    width: 300px; 
 
    height: 100px; 
 
    background-color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="div"></div>

。 jQueryは、デキューはキューから機能を取り出して実行すると述べています。しかし、関数がデキューなしで実行できる場合は、デキューの使用は何ですか？

Answer 1

.dequeue()は、実行中のキューを維持するために呼び出されます.2つのアニメーションを使用する場合、2つ目のアニメーションは使用しないと呼び出されません。コードに基づいて次の例を確認してください。最初のdivには.dequeueコメントが付いているので、1つのアニメーションだけが実行されます。

var divClass = $(".div"); 
 
divClass.animate({ 
 
    height: "50px" 
 
}, 500).queue(function(){ 
 
    
 
    //$(this).dequeue(); 
 
}).animate({height: "100px"},500); 
 

 
var div = $("div"); 
 
div.animate({ 
 
    height: "50px" 
 
}, 500).queue(function(){ 
 
    
 
    $(this).dequeue(); 
 
}).animate({height: "100px"},500);

div { 
 
    width: 300px; 
 
    height: 100px; 
 
    background-color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="div">First DIV</div> 
 
<span>HELLO</span> 
 
<div>Second DIV</div>