menu
書いてる野郎
orebike@gmail.com
var hoge = document.getElementById("hoge"); hoge.addEventListener("click", function(e){ var obj = e.target; // これが発生源 });
ちなみにイベントにはバブリングという概念があるので、イベント発生源と Listener が一致するとは限らない。
この第二引数で与えている 関数 は最終的には hoge のプロパティとして登録されるので、 この内部での this は登録されたオブジェクト(今の場合なら hoge)となる。
これは若干わかりにくい挙動ではあるので発生源は e.target で取得し、登録にはアロー関数を使って this をこのコンテキストで拘束しておくとよい。
DOM の構築が完了したら | JavaScript/イベント/DOMContentLoaded |
要素に対してペースト操作したら | JavaScript/イベント/paste |
ブラウザに元から備わっている動作をイベントで捉えて止めたい場合がある。
クリップボードをペーストした時に内容だけ貰って、実際にはペーストしないみたいなことをしたい。
このような場合は preventDefault メソッドを使うと動きを停止できる
mytextarea.addEventListener("paste", function(e){ e.preventDefault(); });
jQuery 等の仕様で return false すれば止まるみたいなこと書いているページも多いが、addEventListener においては return false しても止まらない。
一部のイベントではこのデフォルトの挙動抑止記述を無視するのがデフォルトになっていたりするので注意が必要である。