Доброго времени суток, уважаемые форумчане! Вопрос в следующем:
В ниже приведённом примере при клике на ссылку с
id='test1' или с
id='test2' вызывается ф-я
WrongMessage, которая выводит id этой самой ссылки алертом. То, что в IE
this в функции НЕ указывает на текущий объект - это понятно... поэтому юзаем
window.event.srcElement.
Почему
window.event.srcElement.id возвращает
ID текущей ссылки, а
window.event.srcElement возвращает непонятно что, хотя по логике должен указывать на текущий объект ссылки!?
P.S. правильная функция
RightMessage(event) и ссылка с
ID="respect" нам говорит, что всё ОК. Где же собака зарыта?!
P.S.S. статьи
http://learn.javascript.ru/this,
http://learn.javascript.ru/bubbling-and-capturing,
http://javascript.ru/tutorial/events/,
http://javascript.ru/tutorial/events/properties я уже прочитал ))
Код HTML
<!DOCTYPE html>
<html>
<head>
<title>Тест [this, return false] в IE</title>
<script type="text/javascript" src="test.js" ></script>
</head>
<body>
<!-- Чёткая ссылка )) -->
<a href="http://javascript.ru" id="respect">Ссылка без onclick в HTML и без ошибок :)</a><br/><br/>
<!-- Ссылки с неправильным JS (( -->
<a href="http://javascript.ru" id="test1">Ссылка без onclick в HTML</a><br/>
<a href="http://javascript.ru" id="test2" onclick="WrongMessage();return false;">Ссылка c onclick без this в HTML</a><br/>
</body>
</html>
Код файла test.js
// универсальная кросс-браузерная ф-я для добавления событий
function addEvent(elm, evType, fn, useCapture) {
if (elm.addEventListener) {
elm.addEventListener(evType, fn, useCapture);
return true;
}
else if (elm.attachEvent) {
var r = elm.attachEvent('on' + evType, fn);
return r;
}
else {
elm['on' + evType] = fn;
}
}
function WrongMessage() {
// как ни странно, НО id выводится и ошибок в IE нет!!!
var aid=this.id || window.event.srcElement.id;
alert(aid);
// а вот здесь в IE aobj.id=undefined (( почему?!
var aobj=this || window.event.srcElement;
alert(aobj.id);
// нужно ТОЛЬКО для ссылки с id='test1'
// для ссылки с id='test2' прописано в onclick в HTML
return false;
}
function RightMessage(event) {
event = event || window.event;
// попутный вопрос №1: можно и грамотно ли писать так, раз работает?!
// var aobj=this || event.srcElement;
var aobj=event.target || event.srcElement;
alert(aobj.id);
// попутный вопрос №2: Есть ли разница между
// event.preventDefault ? event.preventDefault() : event.returnValue = false;
// и return false; !? Какой вариант лучше и почему?
return false;
}
function DOM_OK() {
var resp=document.getElementById("respect");
addEvent(resp, 'click', RightMessage, false);
var a1=document.getElementById("test1");
addEvent(a1, 'click', WrongMessage, false);
}
addEvent(window, 'load', DOM_OK, false);