2個獨立的下拉按鈕

Question

我需要實現兩件事情與這些下拉按鈕DEMO

1. 他們需要從一個 另一個獨立工作。所以基本上我試圖達到的是當您點擊第一個按鈕上的 時，第二個按鈕不會受到影響，反之亦然 。在我的示例中，當您單擊一個按鈕時，另一個 會獲得該邊框並且不應該發生，應該是 完全獨立。

2. 如果單擊第二個下拉列表時第一個下拉列表處於活動狀態，則應自動關閉第一個下拉列表。

我希望我的問題有道理。

謝謝大家！

Answer 1

還有就是工作搭檔：http://fiddle.jshell.net/2Yp5r/4

基本上兩件事：

1. 設置只有點擊的元素爲活動，通過使用$(this)，而不是一般的$('.clicker')

2. 關閉先前打開的標籤，這一切都在下面評論。

   $（「發聲」）。點擊（函數（E）{

    //remove previously active style 
   $(".clicker").removeClass('active'); 
   
   //check if this tab is not opened 
   if($('+ ul', $(this)).css('display') == 'none') 
   { 
       //hide previous opened tab 
       $('.dropdown').not(this).hide(); 
   
       //add style to clicked element 
       $(this).addClass('active'); 
   } 
   
       $('+ ul', $(this)).slideToggle(200); 
   
       if($(e.target).attr('href') == '#') {e.preventDefault();} 
   
       e.stopPropagation(); 
       e.stopPropagation(); 
   });