0

私はjQueryが初めてです。クリックイベントで簡単なドロップダウンメニューを作りたいです。html構造は次のとおりです。

<ul id="menubar">
        <li class="menu">
            <a href="#">Menu 1</a>
            <ul class="submenubar">
                <li class="submenu"><a href="#">Submenu 1</a></li>
            </ul>
        </li>
        <li class="menu">
            <a href="#">Menu 2</a>
            <ul class="submenubar">
                <li class="submenu"><a href="#">Submenu 2</a></li>
            </ul>
        </li>
</ul>​

スクリプトを次のように作成しました。

$(document).ready(function(){
            $('li.submenu').hide()
            $('li.menu').click(function(e){
                $(this).find('li.submenu', this).slideToggle('fast'); 
                e.stopPropagation();
            })
        })​

しかし、ドロップダウンが重なっています。それは私が望むものではありません。必要なのは: - メニュー 1 をクリックすると、サブメニュー 1 が表示されます。他のメニューとサブメニューは非表示になっています。- 次に、メニュー 2 をクリックすると、サブメニュー 1 が非表示になるため、サブメニュー 2 が表示されます。- 等々...

私は何をすべきか？誰でもこれを解決するのを手伝ってもらえますか? ご返信ありがとうございます..

4

1 に答える 1

0

ちょっとこれをチェックしてみてください menu1をクリックすると、submenu1が表示されます menu1をクリックすると、再び他のメニューが非表示になります menu2が表示されます これを試してみてください

http://jsfiddle.net/96xnB/

于 2012-07-25T09:34:20.103 に答える