Internet explorer 9 InternetExplorer 9、10和；11事件构造函数不'；行不通

我正在创建一个事件，因此请使用DOM事件构造函数：

new Event('change');

这在现代浏览器中运行良好，但在Internet Explorer 9、10和11中，它在以下方面失败：

Object doesn't support this action

如何修复Internet Explorer（理想情况下通过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;
})();

---

如果您只是尝试分派一个简单的事件，如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);

---

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

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;
}

---

该软件包具有以下神奇功能：

包括包装并按如下方式发送事件：

window.dispatchEvent(new window.CustomEvent('some-event'))

---

我个人使用包装器函数来处理手动创建的事件。以下代码将在所有

Event

接口上添加一个静态方法（所有以

Event

结尾的全局变量都是一个事件接口），并允许您调用类似

element.dispatchEvent（MouseEvent.create（'click'））的函数在IE9+上

(function eventCreatorWrapper(eventClassNames){
    eventClassNames.forEach(function(eventClassName){
        window[eventClassName].createEvent = function(type,bubbles,cancelable){
            var evt
            try{
                evt = new window[eventClassName](type,{
                    bubbles: bubbles,
                    cancelable: cancelable
                });
            } catch (e){
                evt = document.createEvent(eventClassName);
                evt.initEvent(type,bubbles,cancelable);
            } finally {
                return evt;
            }
        }
    });
}(function(root){
    return Object.getOwnPropertyNames(root).filter(function(propertyName){
        return /Event$/.test(propertyName)
    });
}(window)));

编辑：查找所有
事件
接口的函数也可以被一个数组所取代，以仅更改所需的事件接口（
['Event'、'MouseEvent'、'KeyboardEvent'、'UIEvent'/*等…/]
）。
自定义事件
npm包对我来说工作得很好


有一个polyfill服务可以为您修补这个和其他



先生，你救了我的命。完全替换是否安全？我的意思是，在最后一行执行
window.Event=CustomEvent
。在IE11中，似乎可以安全地设置window.Event=CustomEvent，是的。对于任何感兴趣的人来说，似乎都可以通过检查typeof（Event）来检测你是否在IE中（在这种情况下），typeof（Event）是除IE中的“object”之外的所有IE的“函数”。然后，您可以使用上述方法安全地聚合事件构造函数。我正在研究
StorageEvent
的类似解决方法，并且
typeof（StorageEvent）
在MS Edge中不起作用。这是有效的：
尝试{new StorageEvent（）；}catch（e）{/*polyfill*/}
。如果您使用的是使用IE定义的CustomEvent构造函数的第三方库，则替换window.CustomEvent可能不安全。它可以工作！我只是认为它应该
返回事件
，这样我就可以将它传递给
dispatchEvent（）
initEvent
是旧的，您至少需要使用现代的方式，作为一种回退，使用不推荐的方式。@vsync它可能不推荐使用，但是您链接到的文档说“而是使用特定的事件构造函数，如event（）”，这正是它试图填充的内容，因此实际上没有选择。
CustomEvent
允许通过
detail
选项传递自定义数据，而
Event
不允许。我错了吗？根据我自己的经验，IE9、10或11都不支持CustomEvent。唯一好的答案似乎是被接受的。“我怎样才能修复Internet Explorer？”XD不明白为什么要将
es6
让
与应该在旧IE上运行的代码混合使用（而不是使用
var
）。。这可能会让复制粘贴的初学者感到困惑this@vsync耸耸肩我确实提到了版本号。我的个人网站去年只针对IE11，所以我从来没有想过检查旧版本的支持。（到今天为止，我提供的是没有样式表或脚本的IE11纯HTML。人们需要继续前进。）无论如何，截至2017年4月，微软仍然支持的唯一版本是11版Internet Explorer，因此这有点毫无意义。我不鼓励任何人使用不受支持的浏览器。网络可能是一个危险的地方。它根本不是关于这个，也不是关于试图改变世界或任何事情。例如，该问题的标题特别要求
IE 9
及以上版本，也许是一个寻找答案的人发现了这条线索，正在为旧版银行系统开发应用程序，或为无法控制其计算机且必须使用旧版IE的商业客户开发其他系统。这与Microsoft支持无关。这是一个很好的答案，但已经有另一个NPM软件包被提及作为答案。给用户提供多种选择有什么错？一个更通用的软件包是95个依赖项？DamienRoche可能是你把“依赖项”误读为“依赖项”吗？因为包实际上有0个依赖项和（在编写本文时）102个依赖项（即依赖于它的包）。那102个包裹在7月份可能是95个。我做得很好P
var CustomEvent = require('custom-event');

// add an appropriate event listener
target.addEventListener('cat', function(e) { process(e.detail) });

// create and dispatch the event
var event = new CustomEvent('cat', {
  detail: {
    hazcheeseburger: true
  }
});
target.dispatchEvent(event);

 <script crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js"></script>