Триггеры событий могут быть хорошо изучены буквально, и они используются для запуска событий, но некоторые друзья, которые их не использовали, могут быть запутаны. Являются ли события, как правило, запускаются фактическими операциями пользователей на странице? Эта точка зрения не совсем верна, потому что некоторые события должны быть реализованы программами, такими как пользовательские события, и некоторые пользовательские события jQuery Ajax Framework должны быть реализованы с помощью триггеров событий. Конечно, в некоторых особых случаях удобнее использовать триггеры событий для запуска событий, чем запускать события в результате фактических операций пользователя.
Браузер имеет собственные методы для поддержки реализации триггеров событий, но существуют большие различия в совместимости. Эта проблема совместимости полностью ожидается. IE имеет свои собственные методы, а другие стандартные браузеры также имеют набор методов. Не говоря уже о том, чьи методы хороши или плохи, для веб -разработчиков, для разработчиков является пыткой разработчиков разработчиков. IE поддерживает метод FIREEVENT для реализации запуска событий, стандартные браузеры поддерживают DispatchEvent для реализации запуска событий, и оба поддерживают IE9. Ниже приведен исходный код от Prototype.js (на самом деле я скопировал его из блога Situ Zhengmei):
Кода -копия выглядит следующим образом:
var fireVent = function (element, event) {
if (document.createeventobject) {
// IE Browser поддерживает метод Firevent
var evt = document.createeventObject ();
return element.firevent ('on'+event, evt)
}
еще{
// Другие стандартные браузеры используют метод диспетчеры
var evt = document.createevent ('htmlevents');
// Initevent принимает 3 параметры:
// Тип события, будь то пузырится, независимо от того, блокирует ли он поведение браузера по умолчанию
evt.initevent (Event, true, true);
return! element.dispatchevent (evt);
}
};
Приведенный выше метод совместим с основными браузерами для реализации функции триггеров событий. Однако для некоторых инкапсулированных систем обработки событий, таких как модуль событий jQuery, это не так просто и может быть реализовано только посредством моделирования. Я уже писал очень простую систему обработки событий, и недавно сталкивался с необходимостью в пользовательских событиях, поэтому я смоделировал триггер событий на основе предыдущей системы событий, и код выглядит следующим образом:
Кода -копия выглядит следующим образом:
/**
* Триггер событий
* @param {объект} элемент DOM
* @param {String / Object} Тип события / объект события
* @param {массив} Дополнительные параметры переданы функции обработчика событий
* @param {boolean} это пузырь
*/
Триггер: функция (Elem, Event, Data, IsstopPropagation) {
var type = event.type || событие,
// пузырь родительский элемент, вплоть до документирования, окно
родитель = elem.parentnode ||
elem.ownerdocument ||
elem === elem.ownerdocument && win,
eventHandler = $ .data (lem, type + 'обработчик');
isstoppropagation = typeof data === 'boolean'?
Данные: (isstoppropagation || false);
data = data && isarray (data)? данные : [];
// Создать пользовательский объект события
Event = typeOf Event === 'Object'?
событие : {
Тип: Тип,
Предотвратить
StopPropagation: function () {
isstoppropagation = true;
}
};
Event.Target = elem;
data.unshift (событие);
if (eventhandler) {
eventhandler.call (elem, data);
}
// рекурсивно вызвать себя для моделирования пузырьков
if (parent &&! isstoppropagation) {
data.shift ();
this.trigger (родитель, событие, данные);
}
}
Принцип симуляции не сложно. Свяжите функцию обработки событий с определенным элементом. Если существует фактическая операция запуска события, будет выполнена соответствующая функция обработки событий. Поэтому, чтобы достичь функции триггера события, просто получите соответствующую функцию обработки событий и выполните ее. Это самый простой.
Когда происходит фактическое событие, браузер будет генерировать объект события, который содержит некоторые атрибуты и информацию, когда происходит событие. Если нет фактического события, нет объекта события, поэтому приведенный выше код также создает объект события для выполнения самых основных функций.
Есть также события, которые пузырят. Если реальных событий не произойдет, естественно не будет поведения пузыря. Затем, если вы хотите смоделировать функцию пузырьков, вы должны постоянно просматривать родительский элемент и проверять, связан ли один и тот же тип события до документа и окна. Если структура является сложной, производительность этого метода рекурсивного вызова, по оценкам, не очень хороша.
Наконец, существует поведение браузера по умолчанию. Я думаю, что имитировать это довольно трудно, настолько неприятно, что я не знаю, как это реализовать. Например, прыжок по умолчанию тега A. Я проверил триггер jQuery, но он не был реализован, но некоторые другие поведения, похоже, введены в руководстве API. В конце концов, эта функция не очень важна, и я еще не провел много подробных исследований.