2

クリック イベントが関連付けられている div 内に要素があります。どちらのクリック イベントも正常に機能しますが、両方が同時に発生します。

内部要素をクリックして親 div のクリック イベントを無効にすると:

私のhtml（@foreach MVC Razorループ内）：

<td class="tdfuncLangSignOff tdNotChecked tdLang@(item.Language.Name)" title="@(item.SignedOffStatus)">
    <div class="addComment"></div>
    @Html.Hidden("funcSignOffId", item.Id)
</td>

私のjquery：

var handler = function () {
    var thisTD = $(this);
    var signOffId = thisTD.parent().children("input#funcSignOffId").val();
    console.log("parent div click");
}

    $(".tdfuncLangSignOff").click(handler);

$(".addComment").click(function () { 
    $(this).parent().unbind("click")
    console.log("nested div click");
    //$(this).parent().click(handler)
});

このスレッドからハンドラーのアイデアを見つけました

これにより、必要に応じて addComment div をクリックし、親 div のクリックを無効にすることができます。しかし、再結合は明らかに起こりません。addComment クリック機能でコメント$(this).parent().click(handler)を外すと、クリックがトリガーされ、コンソールに「親 div クリック」が表示されます。

親divのクリックをすぐにトリガーせずに再バインドするにはどうすればよいですか?

4

3 に答える 3

5

私があなたを正しく理解している場合: イベントの伝播を停止するには、event.stopPropagation() を使用します。

例：

<div id="a">
    Outer
    <div id="b">Inner</div>
<div>

そしてJQueryで：

$("#a").click(function(event) {alert("a");});
$("#b").click(function(event) {alert("b"); event.stopPropagation();});

ここで詳細を読むことができます: http://api.jquery.com/event.stopPropagation/

于 2011-08-08T23:53:59.517 に答える
0

あなたが試すことができます：

$(this).parent().bind('click');
于 2011-08-08T23:51:13.963 に答える
0

その理由は、子クリック イベントでクリック ハンドラーを再バインドしているためだと思われます。その後、イベントが次のレベル (その親) に伝達され、クリック ハンドラーが再び保持されます。

他に何かが欠けていない限り、伝播を停止するというナオールのアドバイスはあなたの目的に役立つはずです.

于 2011-08-09T00:02:10.867 に答える