Кастомные события (CustomEvent)
С помощью конструктора CustomEvent можно создать своё (нестандартное) событие.
const event = new CustomEvent(typeArg, customEventInit);
- typeArg — строка с названием события;
- customEventInit — объект с единственным свойством detail, в которое можно записать любую, связанную с событием, информацию.
Для вызова события используется специальный метод elem.dispatchEvent(event);,
где elem — DOM элемент который будет записан в Event.target, а event — объект события.
Простой пример:
elem.addEventListener('hello', event => {
console.info(event.detail.name); // => Вася
}, false);
const event = new CustomEvent('hello', { detail: { name: 'Вася' } });
elem.dispatchEvent(event);
Совместимость
Конструктор CustomEvent достаточно хорошо поддерживается. Однако для IE9-11, Mobile IE 10-11 и Android 3-4.3 придётся использовать старый синтаксис (полифил).