イベントハンドラ/トリガー

on

要素にイベントハンドラーを設定する。

.on( events [, selector ] [, data ], handler )

参考:

.on() | jQuery API Documentation [Official]

アロー関数を jQuery の on メソッドと each メソッドで使う場合の this | WEBMAN

off

要素からイベントハンドラーを削除する。

.off( events [, selector] [, handler(eventObject)] )

参考:

.off() | jQuery 1.9 日本語リファレンス (js STUDIO)

trigger

イベントをトリガーする。

.trigger( eventType [, extraParameters ] )

参考:

.trigger() | jQuery API Documentation [Official]

one

一度だけ呼ばれるハンドラーを設定する。

.one( events [, data ], handler )

参考:

.one() | jQuery 1.9 日本語リファレンス (js STUDIO)

one(type, [data], fn) | jQuery 日本語リファレンス (semooh.jp)

.one() | jQuery API Documentation [Official]

submit

.on( 'submit', handler ) のショートハンド

.submit( handler )

.trigger( 'submit' ) のショートハンド

.submit()

参考:

.submit() | jQuery API Documentation [Official]

click

.on( 'click', handler ) のショートハンド

.click( handler )

.trigger( 'click' ) のショートハンド

.click()

参考:

.click() | jQuery API Documentation [Official]

stopPropagation

参考:

event.stopPropagation() | jQuery API Documentation [Official]

preventDefault

参考:

event.preventDefault() | jQuery API Documentation [Official]

triggerHandler

参考:

.triggerHandler() | jQuery API Documentation [Official]

ハンドラの設定は on に統一された

  • bind
  • delegate
  • live
  • click

参考:

jQuery の click と bind と live と delegate と on の違い – Qiita

.bind() | jQuery 1.9 日本語リファレンス (js STUDIO)

.delegate() | jQuery 1.9 日本語リファレンス (js STUDIO)

.live() | jQuery 1.9 日本語リファレンス (js STUDIO)

.click() | jQuery 1.9 日本語リファレンス (js STUDIO)

名前空間

参考:

jQuery.fn.on に名前空間をつけることができる – Qiita

jQuery の off() を使いこなす | to-R

Namespaced Events in jQuery | CSS-Tricks

Can jQuery event namespaces contain dashes? – Stack Overflow

event.namespace

参考:

event.namespace | jQuery 1.9 日本語リファレンス (js STUDIO)

event.namespace | jQuery API 日本語リファレンス (alphasis.info)

jQuery event.namespace Property | W3Schools

event.namespace | jQuery API Documentation [Official]

Event Object

参考:

Event Object | jQuery API Documentation [Official]

イベントハンドラを再登録する

参考:

JavaScript や jQuery でイベントを削除して再登録する方法 – Qiita

要素削除時のイベントハンドラの扱い

jQuery で要素を削除した場合、要素に関連付けられていたデータとイベントハンドラは自動的に削除される。

データとイベントハンドラを維持したまま DOM から切り離したい場合は detach() を使う。

参考:

イベントリスナーをそのままに、要素を削除するには? | Build Insider

.detach() | jQuery API Documentation [Official]

Do I need to detach events in jQuery when I remove elements – Stack Overflow

If a DOM Element is removed, are its listeners also removed from memory? – Stack Overflow

タグ:

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です