別の親メニュー項目をJQueryでクリックしたときにサブメニューを折りたたむ方法

Question

jQueryを使用して折りたたみ可能なメニューを設定しています。現在、slideToggle（）関数を使用してメニュークリックで畳み込みをアニメーション化しています。これは、独立してサブメニューを閉じて開きます。しかし、私は別のものが開くと、サブメニューを崩壊させる方法を見つけようとしています。どんな提案/ヒントも高く評価されます。

のjQuery

<script> 
    function initMenu() { 
     $('#menu ul').hide(); 
     $('#menu li a').click(

     function() { 
     $(this).next().slideToggle('normal') 

     }); 

    } 
    $(document).ready(function() {initMenu();}); 
    </script> 

HTML

<ul id="menu"> 

    <li><a href="#">Home</a></li> 
    <li><a href="#">In the news</a> 

     <ul> 
      <li><a href="#">Youtube</a></li> 
      <li><a href="#">Blog</a></li> 

     </ul> 
    </li> 

    <li><a href="#">Who's Who?</a> 
     <ul> 
      <li><a href="#">Youtube</a></li> 
      <li><a href="#">Tackle Hunger Tackle Hunger</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Services Offered</a></li> 

</ul> 

おかげで、

アンドレ

Answer 1

Here is a working example.

function initMenu() { 
    $('#menu ul').hide(); 
    $('#menu > li > a').on('click', function() { 
     $('#menu ul').slideUp(); 
     $(this).next().slideDown(); 
    }); 
} 
$(document).ready(initMenu); 

Answer 2

function initMenu() { 
    $('#menu ul').hide(); 
    $('#menu li a').click(

    function() { 
     $('#menu ul').hide('normal'); 
     $(this).next().slideToggle('normal'); 

}); 

} 
$(document).ready(function() { 
    initMenu(); 
}); 

デモ：http://jsfiddle.net/ex2z5/

Answer 3

すなわち「サブメニュー」あなたのサブメニュー項目に、メニュー項目、すなわち「メインメニュー」と別のクラスを入れて、すべての「サブメニュー」を閉じるための機能を作ります'メインメニュー'の項目にクリックが発生したときの項目。