2

ここ SO のすばらしい貢献者に感謝します! jQuery を理解し始めると、jQuery の方がはるかにクールです。:)

したがって、クリックすると子ULを表示/非表示にするLIがあります。私がやりたいことは、空白のウィンドウを開く LI 内のリンクをクリックする機能を持つことですが、子 UL を閉じることもありません。ブランクウィンドウのオープンが完了しました

a[href^="http://"]').attr("target", "_blank");

ただし、LI で "return: false" を返す方法がわからないため、空白のウィンドウが開いたときに UL を閉じません。ユーザーが空白のウィンドウを閉じたときに、ユーザーが使用していた子 UL を表示できるようにしたいと考えています。

これが明確でない場合は、お知らせください。

ありがとう！

4

2 に答える 2

8

あなたが探しているのはおそらく event.stopPropagation() だと思います

ドキュメントは次のとおりです。http://api.jquery.com/event.stopPropagation/

基本的には、 をクリックすると<a>クリック イベントがトリガーされますが、クリック イベントに含まれているため<li>、クリック イベントもトリガーされます。イベントが子から親に移動するこのプロセスは、イベント バブリングと呼ばれます。event.stopPropagation() を使用して停止できます。

次のような HTML 構造があるとします。

<ul>
    <li class="reveal">One<br />
        <a href="http://www.google.com" target="_blank">Google</a>
            <ul>
                <li>a</li>
                <li>b</li>
                <li>c</li>
        </ul>
    </li>
    <li class="reveal">Two<br />
        <a href="http://www.google.com" target="_blank">Google</a>
            <ul>
                <li>a</li>
                <li>b</li>
                <li>c</li>
        </ul>
    </li>
    <li class="reveal">Three<br />
        <a href="http://www.google.com" target="_blank">Google</a>
            <ul>
                <li>a</li>
                <li>b</li>
                <li>c</li>
        </ul>
    </li>
</ul>

さらに、CSS ルールがあるとします。

ul ul { display: none; }

この jQuery を適用すると、探している結果が得られるはずです。

$(function () {
    $('.reveal').click(function() {
        $(this).children('ul').slideToggle();
    });

    $('.reveal a').click(function(event) {
        event.stopPropagation();
    });
});

これが実際に動作しているライブデモです: http://jsfiddle.net/PaxTg/

于 2010-08-20T23:18:57.997 に答える
3

イベントの順序を確認してから、適切なタイミングでイベントの伝播を停止することができます。

于 2010-08-20T23:16:24.953 に答える