イベント

参考:

Events | jQuery API Documentation [Official]

on

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

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

参考:

on メソッドの使用方法 – Qiita

jQuery でイベントリスナの登録 – Qiita

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

イベントハンドラの on | 初心者向けの jQuery入門講座 (jquerystudy.info)

.on() | jQuery API Documentation [Official]

off

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

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

参考:

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

.off() | jQuery API Documentation [Official]

trigger

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

.trigger( eventType [, extraParameters ] )

参考:

.trigger() | jQuery API Documentation [Official]

one

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

.one( events [, data ], handler )

参考:

.one() | jQuery 日本語リファレンス (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()

参考:

jQuery でクリックイベントで処理を実行するon(), click() | UX MILK

便利な on を使おう/on click – Qiita

.click() | jQuery API Documentation [Official]

change

参考:

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

change(fn) | jQuery 日本語リファレンス (semooh.jp)

.change() | jQuery API Documentation

チェックボックスの onchange でイベントが発動しないときの解決法 | Now loading… (hayeta.hatenablog.com)

stopPropagation

参考:

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

preventDefault

参考:

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

triggerHandler

参考:

.triggerHandler() | jQuery API Documentation [Official]

ドキュメント全体にイベントハンドラを設定する (document)

参考:

jQuery の document の意味とは? – Qiita

ハンドラの設定は 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)

子孫要素の全てのクリックを拾いたい

参考:

Listen to all onClick events of all children in jQuery – Stack Overflow

alert onclick on element’s child? – Stack Overflow

名前空間

参考:

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 オブジェクト

参考:

jQuery.Event | jQuery 日本語リファレンス (semooh.jp)

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

まとめ

参考:

jQuery Event Methods | W3Schools

記事をシェアする:
タグ:

コメントを残す

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

Protected by reCAPTCHA