0

このように、動的に生成された折りたたみ可能なメニューがあります

<div id="mobile">
    <ul id="navigation">
        <li class="active">
            <a href="index.php?id=12">About Us</a>
        </li>
        <li>
            <a href="index.php?id=24">Approach</a>
            <ul class="subnavi">
                <li>
                    <a href="index.php?id=24">How we work</a>
                </li>
                <li>
                    <a href="index.php?id=25">Who we are</a>
                </li>
                <li>
                    <a href="index.php?id=26">Knowledge</a>
                </li>
            </ul>
        </li>
        <li>
            <a href="index.php?id=14">Solutions</a>
        </li>
        <li>
            <a href="index.php?id=15">Contact</a>
        </li>
    </ul>
</div>

jQuery を使用してサブメニューを折りたたむコードは次のとおりです。

$('#mobile #navigation > li:has(ul) + a').on("click",function() {
    $(this).find('ul').show().end().siblings().find('ul').hide();
    return false;
});

私の問題は、アプローチメニューリンクをクリックすると、「アプローチ」リンクがアクティブになることです。リンクをトリガーせずに .show() API のみを有効にするにはどうすればよいですか。

より具体的に言うと、「アプローチ」をクリックすると、そのページには行きたくありません。サブメニューを折りたたむだけです。

これは意味がありますか？もしそうなら、私にヒントをください。

4

2 に答える 2

0

これを試して 

 $("a").click(function(event){
  event.preventDefault();
});

event.preventDefault() については、このhttp://api.jquery.com/event.preventDefault/を確認してください。

于 2013-09-05T13:39:50.687 に答える
0

セレクターが間違っています。これを使用してください：

$('#mobile #navigation > li:has(ul) > a').on("click",function(e) {
    $(this).siblings('ul').show().end().closest('li').siblings().find('ul').hide();
    e.preventDefault()
});

は の子であるため、に変更+ aしました。> aali

私も変わり.find('ul')ました.siblings('ul')

.closest('li')最後の の前に追加しました.siblings()。

http://jsfiddle.net/tagmx/1/

于 2013-09-05T13:42:29.237 に答える