Firefoxのwindow.eventの不足のための回避策？

Question

私はwindow.eventのFirefoxの欠如によって不意を突かれてい

...つまり

<script> 
function clicked() 
{ 
console.log(event); 
} 
</script> 

<div onclick = "clicked()">Whatever</div> 

は、ほとんどすべての近代的なブラウザでは使えますが、まだ「イベント」は、我々が明示的に持っているのFirefox、で定義されません書き込み

Firefoxでイベントオブジェクトにアクセスするには、関数パラメータとして明示的に指定する必要はありませんが、回避策はありますか？

Answer 1

すべてのイベントリスナーがEventTarget.addEventListener()メソッドによって最終的に登録されるという仮定に基づいて、ここでは醜いハックがあります。以下の "解決策"は、実際のリスナーに委任する前に、イベントをwindow.eventに割り当てるメソッドで、すべてのイベントリスナーをラップするようにEventTargetのプロトタイプ（yuck！）を変更します。

const addEventListener = EventTarget.prototype.addEventListener; 
 

 
EventTarget.prototype.addEventListener = function(name, handler) { 
 
    addEventListener.call(this, name, function(event) { 
 
    window.event = event; 
 
    
 
    handler(event); 
 
    }) 
 
}; 
 

 
function clicked() { 
 
    // just demonstrating that window.event is set 
 
    console.log(window.event.target.innerHTML); 
 
} 
 

 
document.getElementById('one').addEventListener('click', clicked); 
 
document.getElementById('two').addEventListener('click', clicked);

<button id="one">Test 1</button> 
 
<button id="two">Test 2</button>

上記だけの可能なアプローチを示しており、大部分は未検証です。あなたのマイレージは異なる場合があります。

---

更新

たように、これはon... HTML属性またはElement.on...プロパティを使用して割り当てを介して結合し、イベントハンドラのために動作しません、コメントで指摘しました。

代替的な（そして確かに安全な）アプローチは、ドキュメント要素に対してイベントキャプチャを使用し、そこでwindow.eventへの割り当てを実行することです。

document.documentElement.addEventListener('click', function(event) { 
 
    window.event = event; 
 
}, true); 
 

 
function clicked() { 
 
    // just demonstrating that window.event is set 
 
    console.log(window.event.target.innerHTML); 
 
} 
 

 
document.getElementById('one').addEventListener('click', clicked); 
 
document.getElementById('two').onclick = clicked;

<button id="one">Test 1</button> 
 
<button id="two">Test 2</button> 
 
<button id="three" onclick="clicked()">Test 3</button>