• 締切済み

jQuery でドット含むカスタムイベント捕捉

イベント名にドットを含むカスタムイベントを jQuery で捕捉するにはどのような記述をすればよいのでしょうか。 それとも不可能なのでしょうか。 問題となるのは次のようなコードです: $(element).on('my.event', listener); element.dispatchEvent(new CustomEvent('my.event')); 一行目で 'my.event' に対するコールバック listener を設定し,二行目でイベントを生じさせています。 実現したいのは,二行目の記述で listener を呼ぶことです。 しかし jQuery にとってイベント名 'my.event' が指すのは名前空間 '.event' 付きイベント 'my' のことであるため,このコードではコールバックが実行されません。 jQuery はあきらめて,この部分だけ element.addEventListener('my.event', listener); などと書くほかないのでしょうか。 回答よろしくお願いします。 このようなことをしたい理由: jQuery に依存しないオブジェクトを定義し,その中でカスタムイベントを発生させています。 そのときのカスタムイベント名にクラス名をプレフィックスとして付けているのです。 たとえば new CustonEvent('NameSpace.ClassName:click'); などです。 プレフィックスを変えれば済む話ではあるのですが,何かほかの手はないものかと質問した次第です。

みんなの回答

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

よくわかっていないのと、jQeryの処理内容を確認していないので半分推測での回答ですが… 確かに  event.dispatchEvent(new CustomEvent('my.event')); では、イベントを捕捉できないようで、カスタムイベントに関しては別に処理をしている可能性がありますね。 ただし、jQueryのメソッドである  $(element).trigger("my.event"); を用いれば、捕捉可能なようです。 (こちらを用いることで、ブラウザ互換の利点もあります) この際に、ご指摘のようにmy.eventでもmy.event2でもevent.typeはmyとされてしまうようですが、listenerにはちゃんと区別して渡されているようです。 イベント処理側で名前空間を確認する必要がある場合は、event.namespaceで取得できそうです。 少々いい加減な回答なので、ご自身で確認なさってください。 何かのヒントにでもなれば幸いです。

f1204-okw
質問者

お礼

回答ありがとうございます。 たしかに .trigger() を使えばドットを含むイベント名でもキャッチできるようです。 ただ,それでは jQuery に依存しないオブジェクトを定義することができません。 やはり無理なことなのかもしれません。 fujillin さんに回答をいただき,複雑なイベント名はあきらめることを決心しました。 ありがとうございました。

関連するQ&A