クリック可能なjQueryドロップダウンメニューが機能しません

Question

私はJQueryを使用してクリック可能なドロップダウンメニューを作成しました。 ==見える
1）「」ドロップダウントグルをクリックして、「」ドロップダウンメニュー
2）ではない（「」ドロップダウントグルと「」のドロップダウンメニュー）：

ドロップダウンメニューは次のように働かなければなりません= dropdownMenuは非表示です
3）setTimeOutが必要です（実際にはコードはアニメーションCSSです）

複数のドロップダウンメニューが必要です。 bの後、
1）ドロップダウントグルクリック：

、B、C、D ...と "Z"

が、私のドロップダウンメニューには、この問題を与えますドロップダウントグルクリック===ドロップダウンが
2隠蔽されていない）が、このコードは、私がdropdownToggle.clickを含めたい（document.closesetを含まない（関数（）< < <

がどのように私は行くことができます私はこれをクリアしようとしていますスス？ ご協力いただければ幸いです。既存のコードを使用して

$(function(){ 
 
\t body = $('body'); 
 

 
    /* dropdown */ 
 
    var dropdown = $('.dropdown'), 
 
     dropdownToggle = dropdown.find('.toggle'), 
 
     dropdownMenu = dropdown.find('.menu'), 
 
     checkDropdownOpen = 'close'; 
 
    
 
    dropdownToggle.click(function() { 
 
    $(this).each(function() {  
 
     // setInitial 
 
     var thisDropdown = $(this).parent('.dropdown'), 
 
      thisDropdownToggle = $(this), 
 
      thisDropdownMenu = $(this).next('.menu'); 
 

 
     // checkDropdownMenu = open 
 
     if (!thisDropdownMenu.hasClass('open') && (thisDropdownMenu.attr('aria-hidden') === 'true' || thisDropdownMenu.attr('aria-hidden') === undefined)) {   
 
     // visible 
 
     setTimeout(function() { 
 
      checkDropdownOpen = 'open'; 
 
      thisDropdownMenu.addClass('open'); 
 
     }, 10); 
 

 
     // attr change 
 
     setTimeout(function() { 
 
      thisDropdownMenu.attr('aria-hidden', 'false'); 
 
     }, 218); 
 
     } else if (thisDropdownMenu.hasClass('open') && thisDropdownMenu.attr('aria-hidden') === 'false') { 
 
     // visible 
 
     setTimeout(function() { 
 
      checkDropdownOpen = 'close'; 
 
      thisDropdownMenu.removeClass('open'); 
 
     }, 10); 
 

 
     // attr change 
 
     setTimeout(function() { 
 
      thisDropdownMenu.attr('aria-hidden', 'true'); 
 
     }, 218); 
 
     } 
 
    }) 
 
    }); 
 
    
 
    /* dropdownClose() */ 
 
    function dropdownClose() { 
 
    // toggle 
 
    dropdownMenu.removeClass('open'); 
 

 
    // hidden, attr change 
 
    setTimeout(function() { 
 
     body.removeClass('account-open'); 
 
     dropdownMenu.attr('aria-hidden', 'true'); 
 
    }, 218); 
 
    } 
 
    
 
    /* document click */ 
 
    $(document).click(function(e) { 
 
    // dropdown 
 
    if (!$(e.target).closest(dropdown).length) { 
 
     dropdownClose(); 
 
    } 
 
    }); 
 
});

.dropdown .menu { 
 
    display: none; 
 
} 
 

 
.dropdown .menu.open { 
 
    display:block; 
 
}

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

 
<div class="dropdown"> 
 
    <button class="toggle">button</button> 
 
    <div class="menu">article</div> 
 
</div>

Answer 1

、あなたがこの行追加することができます。これらの線の間の

dropdownClose(); 

：

dropdownToggle.click(function() { 
$(this).each(function() { 

をこれが開く前に全体メニューを閉じますターゲット兄弟メニュー

$(document).ready(function() { 
    $('.toggle').on('click', function() { 
    $('.menu').hide(250); 
    $(this).next().show(500); 
    }); 
});