Internet Explorer 9,10和11事件构造函数不起作用

mik*_*ana 119 custom-events dom-events internet-explorer-9 internet-explorer-10 internet-explorer-11

我正在创建一个事件,所以使用DOM Event构造函数:

new Event('change');
Run Code Online (Sandbox Code Playgroud)

这在现代浏览器中工作正常,但在Internet Explorer 9,10和11中,它失败了:

Object doesn't support this action
Run Code Online (Sandbox Code Playgroud)

如何修复Internet Explorer(理想情况下通过polyfill)?如果我不能,是否有可以使用的解决方法?

mik*_*ana 163

在MDN上有一个用于CustomEvent构造函数IE polyfill.将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;
})();
Run Code Online (Sandbox Code Playgroud)

  • 先生,你救了我的命.完全替换是否安全?我的意思是,在最后一行做`window.Event = CustomEvent`. (13认同)
  • 对于任何感兴趣的人,似乎有可能通过检查typeof(事件)来检测你在IE中(对于这种情况),除了IE之外的所有人都是'对象',它是'对象'.然后,您可以使用上述方法安全地填充Event构造函数. (10认同)
  • 在IE11中,设置window.Event = CustomEvent似乎是安全的,是的. (7认同)

mic*_*uda 48

我认为解决问题和处理跨浏览器事件创建的最佳解决方案是:

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;
}
Run Code Online (Sandbox Code Playgroud)

  • 有用!我只是认为它应该"返回事件",所以我可以将它传递给`dispatchEvent()`. (3认同)
  • @vsync它可能已被弃用,但是您链接的文档说“而不是使用特定的事件构造函数,例如Event()”,这是_exactly_试图填充的内容,因此实际上没有选择。 (2认同)