jQuery延遲和fadeOut有時不起作用

Question

我在多個元素上有delay（）和hide（）問題。

假設我有這樣的事情：

<div id="one">
<p id="label1_one">text</p>
<p id="label2_one">text</p>
</div>

<div id="two">
<p id="label1_two">text</p>
<p id="label2_two">text</p>
</div>

<div id="three">
<p id="label1_three">text</p>
<p id="label2_three">text</p>
</div>

和腳本

function toogle(){
if (1){
$("#one").css("display", "inline-block");
$("#label1_two").css("display", "inline-block").delay(10000).fadeOut(1000);
$("#label2_two").css("display", "inline-block").delay(10000).fadeOut(1000);
$("#label1_three").css("display", "inline-block").delay(10000).fadeOut(1000);
$("#label2_three").css("display", "inline-block").delay(10000).fadeOut(1000);
}
if (2){
$("#two").css("display", "inline-block");
$("#label1_one").css("display", "inline-block").delay(10000).fadeOut(1000);
$("#label2_one").css("display", "inline-block").delay(10000).fadeOut(1000);
$("#label1_three").css("display", "inline-block").delay(10000).fadeOut(1000);
$("#label2_three").css("display", "inline-block").delay(10000).fadeOut(1000);
}
if (3){
$("#three").css("display", "inline-block");
$("#label1_one").css("display", "inline-block").delay(10000).fadeOut(1000);
$("#label2_one").css("display", "inline-block").delay(10000).fadeOut(1000);
$("#label1_two").css("display", "inline-block").delay(10000).fadeOut(1000);
$("#label2_two").css("display", "inline-block").delay(10000).fadeOut(1000);
}
}

每次某些元素在頁面上保持可見。 是否存在一些已知問題。

或者有人可以向我指出其他解決方案。

Code is example from real situation. :)

預先感謝，韋德蘭

Answer 1

if(1) 

表示它將始終訪問您的if語句

如果要在jQuery中引用div id，則需要將其更改為以下形式：

$('#one').click(function(){
    //do something.
});

Answer 2

您可以嘗試使用.stop方法（ http://api.jquery.com/stop/ ），如果在嘗試對已經動畫的對象進行動畫處理時發生錯誤，則調用stop將在開始之前清除所有動畫

$("#label1_one").css("display", "inline-block").stop(true, true).delay(10000).fadeOut(1000);