domEvent.manager

Статический объект.

Предоставляет единый интерфейс для работы с событиями DOM-элементов во всех браузерах и на всех устройствах. Для устройств, которые не поддерживают мышь, события будут транслироваться.
  • Событие начала касания (touchstart/MSPointerDown) с одной точкой прикосновения транслируется в последовательность событий mouseenter, mousemove и mousedown;
  • Событие перемещения касания (touchmove/MSPointerMove) с одной точкой прикосновения транслируется в событие mousemove;
  • События завершения касания (touchend/MSPointerUp) или отмены (touchcancel/MSPointerCancel) транслируются в последовательность событий mouseup, mousemove и mouseleave, если ранее произошло событие начала касания с одной точкой прикосновения;
  • Быстрое поступление событий начала и завершения с одной точкой прикосновения без перемещения транслируется в событие click;
  • Быстрое поступление двух событий click транслируется в событие dblclick;
  • Если между событиями начала и завершения с одной точкой прикосновения без перемещения была продолжительная задержка, то это транслируется в событие contextmenu.
Также поддерживаются специальные события для обработки нескольких одновременных касаний.
  • multitouchstart отправляется при поступлении события начала касания с двумя и более точками прикосновений;
  • multitouchmove отправляется при поступлении события перемещения касания с двумя и более точками прикосновений;
  • multitouchend отправляется при поступлении события завершения касания, если ранее было отправлено событие multitouchstart;
  • При добавлении/удалении точки прикосновения будет отправлено событие multitouchend и событие multitouchstart, если оставшееся количество точек больше или равно двум.

Менеджер работы с событиями DOM-элементов.

Методы

Примеры:

1.

// Прослушивание событий одного DOM-элемента.
var block = document.getElementById('block');
ymaps.domEvent.manager
    .add(block, 'click', function (event) {
        console.log(event.get('type')); // click
    })
    .add(block, 'mouseleave', function (event) {
        console.log(event.get('type')); // mouseleave
    })
    // Задание одного слушателя на несколько событий.
    .add(block, ['mousedown', 'mouseup'], function (event) {
        console.log(event.get('type')); // mousedown / mouseup
    });

2.

// Использование контейнера событий.
var block = document.getElementById('block'),
    domEventsGroup = ymaps.domEvent.manager.group(block);
domEventsGroup.add('click', function (event) {
    console.log(event.get('type')); // click
    // Удаляем все прослушивания событий.
    domEventsGroup.removeAll();
});

3.

// Исполнение слушателя в контексте определенного объекта.
var block = document.getElementById('block'),
    // Определяем класс.
    someClass = function () {
        this.property = 'value';
    },
    // Создаем реализацию класса.
    someObj = new someClass();
ymaps.domEvent.manager.add(block, 'click', function (event) {
    console.log(this.property + ' ' + event.get('type')); // value click
}, someObj);

4.

// На устройствах, которые поддерживают сенсорный ввод, можно прослушивать специальные события multitouch*
var block = document.getElementById('block');
ymaps.domEvent.manager
    .add(block, ['multitouchstart', 'multitouchmove', 'multitouchend'], function (event) {
        console.log(event.get('type')); // multitouchstart / multitouchmove / multitouchend
        // Запрещаем сдвиг и масштабирование страницы пальцами.
        event.callMethod('preventDefault');
    });

Методы

Имя Статический Возвращает Описание
domEvent.manager.add(htmlElement, types, callback[, context, capture)

domEvent.manager

Добавляет слушателя DOM-событий объекта.

domEvent.manager.group(htmlElement, capture)

event.Group

Создает контейнер для прослушивания событий DOM-элемента.

domEvent.manager.remove(htmlElement, types, callback[, context, capture)

domEvent.manager

Удаляет слушателя DOM-событий объекта.

Имя Статический Возвращает Описание
domEvent.manager.add(htmlElement, types, callback[, context, capture)

domEvent.manager

Добавляет слушателя DOM-событий объекта.

domEvent.manager.group(htmlElement, capture)

event.Group

Создает контейнер для прослушивания событий DOM-элемента.

domEvent.manager.remove(htmlElement, types, callback[, context, capture)

domEvent.manager

Удаляет слушателя DOM-событий объекта.

Описание методов

add

{domEvent.manager}  <static> domEvent.manager.add(htmlElement, types, callback[, context, capture)

Добавляет слушателя DOM-событий объекта.

Returns ссылку на себя.

Параметры:

Параметр Значение по умолчанию Описание
htmlElement *

Тип: HTMLElement

DOM-элемент, события которого необходимо прослушивать.

types *

Тип: String|String[]

Тип или типы событий.

callback *

Тип: Function

Функция-обработчик события.

context

Тип: Object

Контекст исполнения функции-обработчика.

capture *

Тип:

Параметр Значение по умолчанию Описание
htmlElement *

Тип: HTMLElement

DOM-элемент, события которого необходимо прослушивать.

types *

Тип: String|String[]

Тип или типы событий.

callback *

Тип: Function

Функция-обработчик события.

context

Тип: Object

Контекст исполнения функции-обработчика.

capture *

Тип:

* Обязательный параметр/опция.

group

{event.Group}  <static> domEvent.manager.group(htmlElement, capture)

Создает контейнер для прослушивания событий DOM-элемента.

Returns контейнер событий DOM-элемента.

Параметры:

Параметр Значение по умолчанию Описание
htmlElement *

Тип: HTMLElement

Элемент, события которого необходимо прослушивать.

capture *

Тип:

Параметр Значение по умолчанию Описание
htmlElement *

Тип: HTMLElement

Элемент, события которого необходимо прослушивать.

capture *

Тип:

* Обязательный параметр/опция.

remove

{domEvent.manager}  <static> domEvent.manager.remove(htmlElement, types, callback[, context, capture)

Удаляет слушателя DOM-событий объекта.

Returns ссылку на себя.

Параметры:

Параметр Значение по умолчанию Описание
htmlElement *

Тип: HTMLElement

DOM-элемент, события которого прослушиваются.

types *

Тип: String|String[]

Тип или типы событий.

callback *

Тип: Function|String

Функция-обработчик события либо уникальный id пары callback-context.

context window

Тип: Object

Контекст исполнения функции-обработчика.

capture *

Тип:

Параметр Значение по умолчанию Описание
htmlElement *

Тип: HTMLElement

DOM-элемент, события которого прослушиваются.

types *

Тип: String|String[]

Тип или типы событий.

callback *

Тип: Function|String

Функция-обработчик события либо уникальный id пары callback-context.

context window

Тип: Object

Контекст исполнения функции-обработчика.

capture *

Тип:

* Обязательный параметр/опция.