Кросс-браузерная обработка событий
Мне нужна кросс-браузерная функция для регистрации обработчиков событий и (в основном) согласованный опыт обработчиков. Мне не нужен полный вес или функциональность библиотеки, такой как jQuery, поэтому я написал свою собственную. Я считаю, что я достиг своих целей с помощью приведенного ниже кода, и до сих пор мое тестирование было успешным, но я слишком долго на это смотрел. Есть ли недостатки в моей логике или ошибки, которые я пропускаю?
РЕДАКТИРОВАТЬ 1: прокомментировал каждый блок с намерением браузера для ясности. Обновлен блок IE, чтобы не вызывать func
сразу (благодаря зорким глазам Энди Э).
РЕДАКТИРОВАТЬ 2: Обновлен блок IE для вызова func.call()
с this
вместо elem
,
РЕДАКТИРОВАТЬ 3: Обновлено, чтобы передать JSLint с "хорошими частями".
function hookEvent(elem, evt, func)
{
if (typeof elem === "string")
{
elem = document.getElementById(elem);
}
if (!elem)
{
return null;
}
var old, r;
if (elem.addEventListener) //w3c
{
elem.addEventListener(evt, func, false);
r = true;
}
else if (elem.attachEvent) //ie
{
elem[evt + func] = function ()
{
func.call(this, window.event);
};
r = elem.attachEvent("on" + evt, elem[evt + func]);
}
else //old
{
old = elem["on" + evt] ? elem["on" + evt] : function (e) { };
elem["on" + evt] = function (e)
{
if (!e)
{
e = window.event;
}
old.call(this, e);
func.call(this, e);
};
r = true;
}
return r;
}
1 ответ
В этой строке есть проблема:
r = elem.attachEvent("on" + evt, func.call(elem, window.event));
Это немедленно выполнит func(), вместо того, чтобы прикреплять его как обработчик для события. Вместо этого возвращаемое значение функции func() будет присвоено событию, которое выдаст ошибку, если его тип не "function"
,
Я понимаю, что вы не хотите использовать фреймворк, но многие (многие) написали фрагменты кросс-браузерной обработки событий. У Джона Резига есть одна версия, Google для "javascript addEvent" для многих других.