バブリングを使用しないカスタムjQueryイベントのトリガー

Question

オブジェクトに対して非バブリング可能なカスタムjQueryイベントをトリガーしたいとします。バブリングを防ぐためにreturn falseまたはstopPropagationを使用することができます。私が知りたいことは、カスタムイベントをトリガし、デフォルトではバブルしないように指定することができます。

これは私が今持っているコード

 $(".abc").on("change", function() { 
      var e = new $.Event("datachange"); 
      $(this).trigger(e) 
     }); 

上記では#abcにdataChangeイベントをトリガし、イベントのすべての方法をバブルアップ。私はそれを望んでいない。私は以下を使ってそれを達成することができます。

 $(".abc").on("change", function() { 
      var e = new $.Event("datachange"); 
      //e.stopPropagation(); this does not work 
      $(this).trigger(e) 
     }).on("datachange", function (e) { 
      e.stopPropagation(); 
      return false; 
     }); 

私は、triggerHandlerは、最初の一致する要素に対してのみ同様のことを行うと読んでいます。

これを達成するより良い方法はありますか？

Answer 1

triggerHandler()は、セットの最初の要素にのみ適用されますが、$(this)で構築するセットには1つの要素しか含まれていないため、問題はありません。

したがって、あなたが安全に書き込むことができます。

$(".abc").on("change", function() { 
    $(this).triggerHandler("datachange"); 
}); 

その方法を、datachangeイベントはバブルアップドキュメントツリーをしません。