イベントハンドラとeventオブジェクト : JavaScript

Pocket

FirefoxとIEはeventオブジェクトの扱いに違いがあります。
Firefoxのイベントオフジェクトはイベントハンドラの第1引数へ自動的に渡されます。
一方IEはイベントハンドラの引数にイベントオブジェクトを渡しません[1]
代わりにIEはwoinow.eventオブジェクトを使ってイベントハンドラ内でeventオブジェクトを参照します[2]

下記のサンプルはクリックされた要素のタイプを表示します。

<pre><code>
<html>
<head>
var handler = function (e) {
    var evt;
    if (window.event) {
        // IE
        evt = window.event;
    } else {
        // Firefox
	evt = e;
    }
    var type = evt.type;
    alert(type);
}
/*
 * この書き方ではIEでエラーが発生する。
 * var handler = function (e) {
 *    var type = e.type;
 *    alert(type);
 *}
 */
window.onload = function () {
    var elm = document.getElementById('sample');
    elm.onclick = handler;
}
</script>
</head>
<body>
<p id="sample">eventオブジェクトのサンプルです(イベントハンドラ版1)。</p>
</body>
</html>

1. イベントリスナーの場合はIEも引数にイベントオブジェクトを渡します。
2. イベントリスナーとeventオブジェクト : JavaScriptも参照。
イベントリスナーとイベントハンドラの違いに注意。

コメント

No comments yet.

コメントの投稿

改行と段落タグは自動で挿入されます。
メールアドレスは表示されません。