1

HTML ツリーの最も内側の要素でクリック イベントを発生させようとしていますが、クリックがその親コン​​テナーに関連付けられているため、両方のイベントが発生します。これは必要なものではありません。以前に stopPropagation() でこれを修正しましたが、今日は機能しないようです。

jQuery('#parent li').click(function() {
    jQuery(this).children('.contained').slideDown();
});
jQuery('.contained').click(function() {                 
    Query(this).slideUp();
});

ここに私たちのHTMLがあるとしましょう:

<ul id="parent">
    <li>
        click to show more
        <p class="contained">click to hide</p>
    </li>
</ul>

li 内に ap が含まれているため、これは検証されないと思いますが、簡単にするために一時的に無視しましょう。親クリックが直後にslideDown()をトリガーすることなく、内部要素slideUp()を取得するにはどうすればよいですか?

4

3 に答える 3

4

return false泡立ちを止めるには：

jQuery('.contained').click(function() {                 
    Query(this).slideUp();
    return false;
});

false を返すと、イベントのデフォルトの動作も妨げられることに注意してください。 詳細はこちらをご覧ください。

または、イベント オブジェクトのstopPropagation関数を使用します。

jQuery('.contained').click(function(e) {                 
    Query(this).slideUp();
    e.stopPropagation();
});
于 2013-01-21T22:32:24.143 に答える
0

答えは、イベントの伝播を停止することです。これを行うには、 stopPropagationとそのツインであるstopImmediatePropagationを使用できます。または、ハンドラーから false を返すことで、伝播を停止し、デフォルト アクションを防止することもできます。stopPropagation メソッドは、イベントのバブリング、つまり DOM ツリーへのイベントの伝播を防ぎます。stopImmdiatePropagation はそれを行いますが、同じレベルの他のハンドラーが起動するのも防ぎます。false を返すことは、イベントstopPropagationでpreventDefaultを使用することと同じです。

于 2013-01-21T22:34:12.217 に答える
0

2 つの方法があります。伝播を停止するか、2 つのクリック ハンドラを組み合わせて、次のようにコードを調整します。event.target

対象方法:

jQuery('#parent li').click(function(event) {
     var $tgt=jQuery(event.target)
    if (!$tgt.is('.contained') ){
         jQuery(this).children('.contained').slideDown();
    }else{
       $tgt.slideUp();
    }   
});
于 2013-01-21T22:37:16.563 に答える