MouseEvent не работает в Internet Explorer
Это я? Это мой IE? или почему этот код не работает в IE 11:
var clicker = new MouseEvent("click", {
'bubbles': true,
'cancelable': true,
'view': window,
'detail': 0,
'screenX': 0,
'screenY': 0,
'clientX': 0,
'clientY': 0,
'ctrlKey': false,
'altKey': false,
'shiftKey': false,
'metaKey': false,
'button': 0,
'relatedTarget': null
});
Я получаю "Объект не поддерживает это действие" на консоли (F12). Мне пришлось придумать обходной путь, но я просто не понимаю, почему предыдущий код не работает (кстати, предыдущий код взят здесь: https://msdn.microsoft.com/en-us/library/ie/dn905219(v=vs.85).aspx (Создание и запуск синтетических событий). Временное решение:
if (typeof MouseEvent !== 'function') {
(function (){
var _MouseEvent = window.MouseEvent;
window.MouseEvent = function (type, dict){
dict = dict || {};
var event = document.createEvent('MouseEvents');
event.initMouseEvent(
type,
(typeof dict.bubbles == 'undefined') ? true : !!dict.bubbles,
(typeof dict.cancelable == 'undefined') ? false : !!dict.cancelable,
dict.view || window,
dict.detail | 0,
dict.screenX | 0,
dict.screenY | 0,
dict.clientX | 0,
dict.clientY | 0,
!!dict.ctrlKey,
!!dict.altKey,
!!dict.shiftKey,
!!dict.metaKey,
dict.button | 0,
dict.relatedTarget || null
);
return event;
}
})();
}
Дело в том, что я хочу перенести устаревший createEvent/initXXXXEvent в новую форму (var event = new XXXXEvent (...)) всякий раз, когда это возможно, и не полагаться на устаревшие методы.
Ответы
Ответ 1
Документация MSDN из предоставленной вами ссылки указывает, что новый синтаксис шаблона конструктора событий DOM L4:
Относится к Internet Explorer для Windows 10 Технический просмотр и позже.
который является другой версией IE из того, что вы используете. Поэтому он ожидал, что IE11 не поддерживает эту функцию
Ответ 2
Существует polyfill, чтобы он работал в IE.
За исключением того, что блок try catch
в этом коде должен выглядеть следующим образом:
try {
new CustomEvent('test');
return false; // No need to polyfill
} catch (e) {
// Need to polyfill - fall through
}
Я отправил эту поправку на их сайт.
Ответ 3
Еще одним вариантом будет использование пакета полифилл MDN
Монтаж
npm i mdn-polyfills --save
использование
import 'mdn-polyfills/MouseEvent';
const link = document.createElement("a");
link.download = fileName;
link.href = url;
link.dispatchEvent(new MouseEvent("click", {bubbles: true, cancelable: true, view: window}));