在IE 11中调度事件的正确方法

Question

我在Internet Explorer 11中调度事件时遇到问题。目前，我们有：

用于IE和的fireEvent

createEvent
initEvent
dispatchEvent

用于普通浏览器的习惯用法。

问题是，这两种方法在IE11中都不起作用，新的方式--使用new Event() / new CustomEvent() --也不起作用。

看起来微软放弃了他们的专有fireEvent (针对IE11)，但没有提供对正确分派的支持。

PS。我相信我已经阅读了这里所有的主题，所以相关的问题仍然找不到可行的解决方案

Answer 1

这是一个完全有效的解决方案，我基于这个答案：https://stackoverflow.com/a/49071358/79677

您可以像这样使用它：SendBrowserAgnosticEvent(myElement, 'change')，它将返回创建的Event对象

下面是JavaScript中的代码

/** This allows us to dispatch browser events in old IE and newer browsers */
export var SendBrowserAgnosticEvent = function(elem, eventName) {
    //Needed for IE Support: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/dispatchEvent#Browser_Compatibility
    //https://stackoverflow.com/a/49071358/79677
    var event;
    if (typeof(Event) === 'function') {
        event = new Event(eventName);
    } else {
        event = document.createEvent('Event');
        event.initEvent(eventName, true, true);
    }
    elem.dispatchEvent(event);

    return event;
};

这是带有完整类型的TypeScript格式

/** This allows us to dispatch browser events in old IE and newer browsers */
export const SendBrowserAgnosticEvent = <T extends HTMLElement | Window>(elem: T, eventName: string): Event => {
    //Needed for IE Support: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/dispatchEvent#Browser_Compatibility
    //https://stackoverflow.com/a/49071358/79677
    let event;
    if (typeof(Event) === 'function') {
        event = new Event(eventName);
    } else {
        event = document.createEvent('Event');
        event.initEvent(eventName, true, true);
    }
    elem.dispatchEvent(event);

    return event;
};

Answer 2

回答我自己的问题(感谢@LynnCrumbling指出)：

浏览器特定的事件触发行为最好替换为统一的jQuery调用，如：

var eventObject = jQuery.Event("change"); // event you need to fire
$(targetObject).trigger(eventObject);