イベントの伝播を停止するにはどうすればよいですか?

mmaceachran

stopPropigationを使用する必要があることは理解していますが、onClick関数からイベントへの参照を取得するにはどうすればよいですか。また、イベントが要素にどのように関連付けられているかを確認するにはどうすればよいですか。だから私はこのような簡単なボタンを持っています:

<button class="btn btn-default" onclick="addRoleToReportClicked()">

関数は次のようになります。

function addRoleToReportClicked() {
    $('#addRoleDiv').show();
}

とても簡単。そして、うまく働いていました。Unitl仕事からコードを更新しました。これでdivが表示されますが、他の処理、つまりページ全体の再読み込みに進みます。

Firefoxを使用していますが、ボタンに「バブリング」イベントハンドラーと「DOM0」イベントハンドラーが含まれていることがわかります。それがどのようにしてそこに到達したのか知りたいのですが、もっと重要なのは2つの質問です。

  1. addRoleToReportClicked()関数でこれを停止するにはどうすればよいですか?(Propogationを停止できると思いますが、イベントを処理するにはどうすればよいですか?

  2. これらのイベントリスナーを追加しているコードを見つける簡単な方法はありますか?デバッグを試しましたが、何も表示されませんでした。20以上のjsファイルと数千行のコードを調べて見つけたくありません。しかし、私は開発者を追い詰めて撃ちたいと思っています。

更新

私はこれを試しました:

    $("#addRoleDivButton").unbind("click").on("click", function(e){
      e.cancelBubble = true;
      e.stopPropagation();
      e.bubbles = false;
      $('#addRoleDiv').show();
    });

どれもうまくいきませんでした。フォーム送信のアイデアを考えて、ページ上の他のすべてのボタンが正常に機能していることに気付きましたが、これはfromの中にありました。そこで、タグを「ボタン」から「a」に変更しましたが、問題なく動作します。誰かがフォームタグ内のすべてのボタンにsubmit()を添付しました。送信を停止するにはどうすればよいですか?

ブレインレスコーダー

バブリングを止める方法はたくさんありますが、最も人気のある2つの方法は-

伝播を停止します-

function addRoleToReportClicked(e) {
    e.stopPropagation();
    $('#addRoleDiv').show();
}

または、他のハンドラーのバインドを解除します-

<button class="btn btn-default btn-1">

$(".btn-1").unbind("click").on("click", function(){
    $('#addRoleDiv').show();
});

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

イベントの伝播が停止したかどうかを確認するにはどうすればよいですか?

分類Dev

別の親とのドロップ可能なイベントの伝播を停止するにはどうすればよいですか?

分類Dev

React NativeのネストされたTouchableでタッチイベントを伝播するにはどうすればよいですか?

分類Dev

Hammer.jsがスワイプイベントを伝播しないようにするにはどうすればよいですか?

分類Dev

リンククリック時のイベント伝播を防ぐにはどうすればよいですか?

分類Dev

const伝播ポインタ型ラッパーを作成するにはどうすればよいですか?

分類Dev

iscsiイニシエーターの伝播を変更するにはどうすればよいですか?

分類Dev

一部のAndroidイベントが伝播を停止し、他のイベントは伝播を停止する必要がないのはなぜですか?

分類Dev

JavaScriptでイベントのバブリングを停止するにはどうすればよいですか?

分類Dev

別のstd :: threadが完了するまで例外の伝播を一時停止するにはどうすればよいですか?

分類Dev

iOSでin_app_purchaseFirebaseイベントの追跡を停止するにはどうすればよいですか?

分類Dev

Reactとマウスイベントの伝播で再利用可能なコンポーネントを実現するにはどうすればよいですか?

分類Dev

ag-grid-reactcellEditorコンポーネントで「Enter」キーを押したときにイベントが伝播しないようにするにはどうすればよいですか?

分類Dev

あるファイルに加えられた変更を別のファイルに伝播するにはどうすればよいですか?

分類Dev

WebKitにスタイルの変更を伝播するために再描画/再描画を強制するにはどうすればよいですか?

分類Dev

Rancher-Kubernetesフィーチャーゲートでマウント伝播を有効にするにはどうすればよいですか?

分類Dev

イベント内のイベントを変更するときにPropagationを停止するにはどうすればよいですか?

分類Dev

異なるサイズのレイヤーで逆伝播を実行するにはどうすればよいですか?

分類Dev

jqueryで$(window).scrollイベントを停止するにはどうすればよいですか?

分類Dev

カスタム式でNULL値を伝播するにはどうすればよいですか?

分類Dev

カスタム計算のためにKenticoストア設定で丸め構成を伝播するにはどうすればよいですか?

分類Dev

タッチイベントをTouchableOpacityでラップされたテキストリンクに伝播させるにはどうすればよいですか?

分類Dev

オブジェクトの削除を伝播または検出するにはどうすればよいですか?

分類Dev

onClickイベント(ReactJS)の後にonMouseOutイベントを停止するにはどうすればよいですか?

分類Dev

あるExcelシートの値をインクリメントしながら他のシートに伝播させるにはどうすればよいですか?

分類Dev

Jqueryのいくつかのイベントで複数の呼び出しを停止するにはどうすればよいですか?

分類Dev

AngularJS:ng-clickからのイベント伝播を停止する方法は?

分類Dev

これをjQueryのイベントにバインドするにはどうすればよいですか?

分類Dev

関数を2回逆伝播する必要がある場合に、関数の再計算を回避するにはどうすればよいですか?

Related 関連記事

  1. 1

    イベントの伝播が停止したかどうかを確認するにはどうすればよいですか?

  2. 2

    別の親とのドロップ可能なイベントの伝播を停止するにはどうすればよいですか?

  3. 3

    React NativeのネストされたTouchableでタッチイベントを伝播するにはどうすればよいですか?

  4. 4

    Hammer.jsがスワイプイベントを伝播しないようにするにはどうすればよいですか?

  5. 5

    リンククリック時のイベント伝播を防ぐにはどうすればよいですか?

  6. 6

    const伝播ポインタ型ラッパーを作成するにはどうすればよいですか?

  7. 7

    iscsiイニシエーターの伝播を変更するにはどうすればよいですか?

  8. 8

    一部のAndroidイベントが伝播を停止し、他のイベントは伝播を停止する必要がないのはなぜですか?

  9. 9

    JavaScriptでイベントのバブリングを停止するにはどうすればよいですか?

  10. 10

    別のstd :: threadが完了するまで例外の伝播を一時停止するにはどうすればよいですか?

  11. 11

    iOSでin_app_purchaseFirebaseイベントの追跡を停止するにはどうすればよいですか?

  12. 12

    Reactとマウスイベントの伝播で再利用可能なコンポーネントを実現するにはどうすればよいですか?

  13. 13

    ag-grid-reactcellEditorコンポーネントで「Enter」キーを押したときにイベントが伝播しないようにするにはどうすればよいですか?

  14. 14

    あるファイルに加えられた変更を別のファイルに伝播するにはどうすればよいですか?

  15. 15

    WebKitにスタイルの変更を伝播するために再描画/再描画を強制するにはどうすればよいですか?

  16. 16

    Rancher-Kubernetesフィーチャーゲートでマウント伝播を有効にするにはどうすればよいですか?

  17. 17

    イベント内のイベントを変更するときにPropagationを停止するにはどうすればよいですか?

  18. 18

    異なるサイズのレイヤーで逆伝播を実行するにはどうすればよいですか?

  19. 19

    jqueryで$(window).scrollイベントを停止するにはどうすればよいですか?

  20. 20

    カスタム式でNULL値を伝播するにはどうすればよいですか?

  21. 21

    カスタム計算のためにKenticoストア設定で丸め構成を伝播するにはどうすればよいですか?

  22. 22

    タッチイベントをTouchableOpacityでラップされたテキストリンクに伝播させるにはどうすればよいですか?

  23. 23

    オブジェクトの削除を伝播または検出するにはどうすればよいですか?

  24. 24

    onClickイベント(ReactJS)の後にonMouseOutイベントを停止するにはどうすればよいですか?

  25. 25

    あるExcelシートの値をインクリメントしながら他のシートに伝播させるにはどうすればよいですか?

  26. 26

    Jqueryのいくつかのイベントで複数の呼び出しを停止するにはどうすればよいですか?

  27. 27

    AngularJS:ng-clickからのイベント伝播を停止する方法は?

  28. 28

    これをjQueryのイベントにバインドするにはどうすればよいですか?

  29. 29

    関数を2回逆伝播する必要がある場合に、関数の再計算を回避するにはどうすればよいですか?

ホットタグ

アーカイブ