2

私はあなたのためにフィドルを持っています: http://jsfiddle.net/vSs4f/

div.sub-menuをクリックするだけでを表示したいa.haschildren。本体に負荷がかかる場合は、div.sub-menu閉じる必要があります。もう一度クリックするとa.haschildren、div.sub-menu閉じるはずです。

私は非常に多くのものをサンプリングしましたが、問題は多くの DIV にあると思います。1 つのアイデアはフィドルにあります。

$(function()   {
    $("a.haschildren").click(function(e) {
        e.preventDefault();
        $('div.sub-menu:visible').hide();
        $(this).next('div.sub-menu').show();
    });
});

あなたが私を助けてくれることを本当に願っています、ありがとう！

4

6 に答える 6

2

個人的には、あなたの DOM の構造について私が変更したであろうことがたくさんあります。私は、よく構造化された DOM に基づいて JavaScript 構造を作成する必要があると強く信じています。そのため、トラバーサルは非常に簡単で直感的です。そうは言っても、私はフィドルを提出することで少し大胆になります.それを見て、いくつかのDOMの癖を利用してjavascriptを作る方法について少し洞察を得ることができることを願っていますもう少し直感的でエレガントです。

http://jsfiddle.net/vSs4f/6/

$(function()   {
    $('#menu > div.item')
        .find('a').click(function() {
            var submenu_index = $(this).parents('.item:first').find('.sub-menu').toggle().index('.sub-menu');

            // This chunk can disappear if you're not interested in hiding all of the other sub-menus
            $('.sub-menu').filter(function(index) {
                if(index != submenu_index)
                    return true;
            }).hide();
        }).end()
        .find('div:first').after('<div class="trenner"></div>');
});
于 2013-05-15T05:21:15.640 に答える
1

試す

$(function()   {
    $("a.haschildren").click(function(e) {

        e.preventDefault();
        var item = $(this).closest('div.haschildren').next().next('div.sub-menu').toggle();
        $('div.sub-menu:visible').not(item).hide();
    });
});

デモ:フィドル

于 2013-05-15T04:57:44.933 に答える
1

皮肉なことに、探しているメソッドは .toggle(); です。

http://api.jquery.com/toggle/

于 2013-05-15T04:59:34.017 に答える