internet-explorer-9 - Internet Explorer 9、10、および 11 イベント コンストラクターが機能しない

Question

イベントを作成しているので、DOM Event コンストラクターを使用します。

new Event('change');

これは最新のブラウザーでは問題なく動作しますが、Internet Explorer 9、10、および 11 では次のように失敗します。

Object doesn't support this action

Internet Explorer を修正するにはどうすればよいですか (理想的にはポリフィルを介して)? できない場合、使用できる回避策はありますか?

Answer 1

MDN に CustomEvent コンストラクター用の IE ポリフィルがあります。CustomEvent を IE に追加し、代わりにそれを使用すると機能します。

(function () {
  if ( typeof window.CustomEvent === "function" ) return false; //If not IE

  function CustomEvent ( event, params ) {
    params = params || { bubbles: false, cancelable: false, detail: undefined };
    var evt = document.createEvent( 'CustomEvent' );
    evt.initCustomEvent( event, params.bubbles, params.cancelable, params.detail );
    return evt;
   }

  CustomEvent.prototype = window.Event.prototype;

  window.CustomEvent = CustomEvent;
})();

Answer 2

あなたの問題を解決し、クロスブラウザーイベントの作成に対処するための最良の解決策は次のとおりだと思います。

function createNewEvent(eventName) {
    var event;
    if (typeof(Event) === 'function') {
        event = new Event(eventName);
    } else {
        event = document.createEvent('Event');
        event.initEvent(eventName, true, true);
    }
    return event;
}

Answer 3

HTML トグル イベントのような単純なイベントをディスパッチしようとしているだけの場合、これは Internet Explorer 11 だけでなく他のブラウザーでも機能します。

let toggle_event = null;
try {
    toggle_event = new Event("toggle");
}
catch (error) {
    toggle_event = document.createEvent("Event");
    let doesnt_bubble = false;
    let isnt_cancelable = false;
    toggle_event.initEvent("toggle", doesnt_bubble, isnt_cancelable);
}
// disclosure_control is a details element.
disclosure_control.dispatchEvent(toggle_event);