使slideToggle等待，直到其他div的slideUps完成？

Question

我的目標是一種特定類型的菜單，它分爲四個部分，可以通過單擊部分標題打開和關閉。以下是我目前爲止的內容：http://jsfiddle.net/samuliviitasaari/Ya8P8/9/

除非您已經打開了一個菜單部分，然後再單擊另一個部分標題，否則這種工作方式非常符合我的需要。我希望它等到該部分關閉，然後纔打開另一個;現在這一切都發生了，造成了一些非常醜陋的閃爍。

我的問題是，我是否必須讓腳本'自我感知'（=能夠知道某個特定部分是否打開）還是有一種快速方法可以讓滑動窗口自動等待，直到已經打開部分（如果有的話）已經關閉。當然，如果目前沒有開放部分，請立即前進，不要拖延？

目前，核心代號是相當粗糙，試圖關閉所有其他部分以防萬一，無論他們是真正開放與否：

$("#one").click(function() { 
    $("#toggleone").slideToggle(100); 
    $("#toggletwo").slideUp(100); 
    $("#togglethree").slideUp(100); 
    $("#togglefour").slideUp(100); 
}); 

PS。如果你有任何關於如何使代碼更有說服力的提示，我將不勝感激！

Answer 1

嘗試：

我已經加入toggle類#toggleone,toggletwo,togglethree,togglefour的div。

$(".toggle").hide(); 
$("#one,#two,#three,#four").click(function() { 
    var id = $(this).attr("id"); 
    if ($("#toggle" + id).is(":visible")) { 
     $("#toggle" + id).slideToggle(); 
    } else { 
     if ($(".toggle:visible").length > 0) { 
      $(".toggle:visible").slideUp(function() { 
       $("#toggle" + id).slideToggle(200); 
      }); 
     } else { 
      $("#toggle" + id).slideToggle(); 
     } 
    } 
}); 

Updated fiddle here.

Answer 2

使用.delay()在代碼等待側發生

fiddle updated