読者です 読者をやめる 読者になる 読者になる

7cc@はてなブログ

JavaScriptとかとか

attachEventとonclickのthis

JavaScript EventListener

今更IE8情報。

概要

ある要素にイベントを付けたい場合、いくつも要素がある時は親要素にイベントをつけたほうが良い、と言われている。
イベントオブジェクト - JavaScript初級者から中級者になろう

しかしattachEventではそのイベントを付けた親要素自身を参照できないようだ。その場合parentNodeを辿るしかない。(尤もそのような時はなかなかないと思うけれど)

ul>li というHTMLがあるとき。
ulにイベントをつけてliをクリックすると、どのエレメントが参照されるか。

IE8

method e e.srcElement window.event.srcElement this
onclick - - li ul
attachEvent Event li li window

IE9

method e e.srcElement window.event.srcElement this
onclick MouseEvent li li ul
attachEvent MSEventObj li li window
addEventLis*1 MouseEvent li li ul

*1 addEventListenerではevent.currentTargetからもULを参照できる。

表からわかること

  • IE8ではonclick時にイベントが渡されない
  • attachEventではulを参照できない
  • e.srcElementは要らない…?

備考

  1. onclickは次の形で、無名関数では無い
    ○ li.onclick = fn
    × li.onclick = function(){ fn() }
  2. 確認用のコードは gistsに