☰

jQuery で最初のハンドラーから他のイベント ハンドラーを防ぐ方法 質問する

tag-icon • tag-icon jquery events event-handling
jQuery で最初のハンドラーから他のイベント ハンドラーを防ぐ方法 質問する

HTML 要素に 2 つ以上のイベント ハンドラーをアタッチすると、それらは順番に実行されます。ただし、最初のハンドラーでチェックされた条件に基づいて後続のイベント ハンドラーを停止したい場合は、どうすればよいでしょうか。

例えば：

<div id='target'>
</div>

<p id='result'>
</p>

最初のハンドラーがキャンセルされた場合、2 番目のハンドラーもキャンセルしたいと思います。

$(function() {
    var target = $('#target'),
        result = $('#result');
    target.click(function(e) {
        result.append('first handler<br />');
        // Here I want to cancel all subsequent event handlers
    });
    target.click(function(e) {
        result.append('second handler<br />');
    });
});

バイオリンが見えますここ。

PS: e.preventDefault()HTML 要素のデフォルト アクション (たとえば、リンクのクリックによる HTTP GET 要求の送信を防ぐ) が防止され、e.preventPropagation()DOM ツリー内の親要素にイベントが伝播されなくなることはわかっています。また、中間変数を使用して最初のハンドラーで true に設定し、後続のハンドラーでチェックすることも可能であることもわかっています。しかし、この問題に対するより適切で洗練された解決策があるかどうかを確認したいと思います。

ベストアンサー1

見るevent.stopImmediatePropagation()-http://api.jquery.com/event.stopImmediatePropagation/

jQuery API ドキュメントによると、このメソッドは次のようになります。

残りのハンドラーが実行されないようにし、イベントが DOM ツリーにバブルアップするのを防ぎます。

おすすめ記事