2

イベントがDOMへの伝播を終了したことを検出するJavaScriptまたはjQueryの方法はありますか? クリック時に(ターゲット「html」で)アタッチされるjQueryクリックハンドラーがあり、それを追加するまさにそのクリックが、ターゲットにバブルアップするとトリガーされます。伝播が完了するまでハンドラのアタッチを遅らせたい。event.stopPropagation() は危険なビジネスだと聞いたので、使用したくありません。

これが私のコードです。#title-editable はアンカータグです。vclick は、jQuery Mobile によって定義されたイベントです。#title-editable を 1 回クリックするだけで、両方のコンソール ログを取得できます。

  $("#title-editable").on("vclick", function(event){
    event.preventDefault();
    console.log("First handler fired.");
    /* Would like to detect completion of event propagation here 
      and only execute the next statement after that. */
    $("html").one("vclick",function(){
      console.log("Second handler fired.");
    });
  });

編集:回避策があると思います。内部イベントの .one の代わりに .on を使用して、イベントが最初に発生したときに切り離されないようにします。クリック イベントのターゲットを確認し、内部イベントの変更のみを実行し、ターゲットが #title-editable でない場合は内部イベントを切り離します。

  $("#title-editable").on("vclick", function(event){
    event.preventDefault();
    console.log("First handler fired.");
    $("html").on("vclick",function(event2){
      console.log("Second handler fired.");
      if(!$(event2.target).closest("#title-editable").length){
        console.log("Execute changes here.");
        $("html").off("vclick");
      }
    });
4

1 に答える 1