Правильный способ отправки события в IE 11

У меня проблема с отправкой события в Internet Explorer 11. В настоящее время у нас есть:

fireEvent для IE и

createEvent
initEvent
dispatchEvent

идиома для обычных браузеров.

Проблема в том, что ни один из них не работает в IE 11. Не работает и новый способ - использование new Event() / new CustomEvent().

Похоже, что Microsoft отказалась от своего проприетарного fireEvent (для IE 11), но не предложила поддержку правильной диспетчеризации.

PS. Я считаю, что прочитал все темы здесь, на SO, связанные с этим вопросом, но все еще не могу найти рабочее решение.


person Anatoly Yakimchuk    schedule 09.03.2017    source источник
comment
Разве не для этого предназначен jquery? Чтобы абстрагироваться от всех странностей и неработающих вещей, чтобы вы могли просто вызвать .trigger() .... См. также эту страницу   -  person Lynn Crumbling    schedule 10.03.2017
comment
@LynnCrumbling Выглядит многообещающе, попробую, когда буду на работе   -  person Anatoly Yakimchuk    schedule 10.03.2017
comment
@LynnCrumbling Предложенное вами решение работает безупречно! Спасибо   -  person Anatoly Yakimchuk    schedule 10.03.2017


Ответы (2)


Вот полностью рабочее решение, основанное на этом ответе SO: 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;
};
person CBarr    schedule 13.05.2019
comment
Спасибо за код, написанный на TypeScript. Мне это было полезно. - person Chris; 25.06.2020

Отвечая на мой собственный вопрос (спасибо @LynnCrumbling за указание):

Поведение запуска событий, специфичное для браузера, лучше заменить унифицированным вызовом jQuery, например:

var eventObject = jQuery.Event("change"); // event you need to fire
$(targetObject).trigger(eventObject);
person Anatoly Yakimchuk    schedule 10.03.2017
comment
Потрясающий! И спасибо за публикацию ответа. - person Lynn Crumbling; 10.03.2017