События в браузере все существуют в форме объектов. Точно так же существует также разница в получении объектов событий между браузером IE и стандартными браузерами DOM. В браузере IE объект события является событием атрибута объекта Windows. Следующий метод обычно используется для доступа к нему.
Кода -копия выглядит следующим образом:
op.onclick = function () {
var oevent = window.event;
}
Хотя это свойство объекта Window, объект события можно получить только при возникновении события. После того, как все функции обработки событий выполняются, объект исчезает.
Стандартный DOM предусматривает, что объекты события должны быть переданы функциям обработки событий в качестве уникальных параметров. Доступ к объектам события в браузерах Firefox, как правило, обычно используется в качестве параметров, а код заключается в следующем:
Кода -копия выглядит следующим образом:
op.onclick = function (oevent) {
}
Следовательно, чтобы быть совместимым с обоими браузерами, обычно используется следующий метод
Кода -копия выглядит следующим образом:
op.onclick = function (oevent) {
if (window.event) oevent = window.event;
}
После получения объекта события браузер может обрабатывать различные события через свою серию свойств и методов, таких как события мыши, события клавиатуры и события браузера. ждать
В следующих перечислены общие свойства и методы:
Из вышесказанного мы видим, что два типа браузеров все еще имеют некоторое сходство. Например, атрибут типа совместим с различными браузерами. Это указывает тип события и возвращает значения, такие как «щелчок» и «MouseMove».
Это очень полезно для обработки нескольких видов событий в одной и той же функции.
Следующим образом: одна и та же функция обрабатывает несколько событий.
Кода -копия выглядит следующим образом:
<script language = "javascript">
Функциональная ручка (oevent) {
var disp = document.getElementbyId ("display");
if (window.event) oevent = window.event; // обрабатывать совместимость и получить объект
if (oevent.type == "click")
disp.innerhtml += "Вы нажали на меня!";
иначе if (oevent.type == "mouseover")
disp.innerhtml += "Вы переходите к моему";
}
window.onload = function () {
var op = document.getElementbyId ("box");
op.onclick = handle;
op.onmouseover = handle;
}
</script>
<div>
<div id = "box"> </div>
<p id = "Display"> Нажмите меня </p>
</div>
Приведенный выше код добавляет две функции ответа на событие в div of id = "box", и эти два события являются одной и той же функцией.
В этой функции сначала рассмотрите возможность получения совместимости объекта события, а затем с использованием диска атрибута Type для имени события.
При обнаружении трех клавиш сдвига, ALT и CTRL методы, используемые двумя типами браузеров, точно одинаковы, оба имеют три атрибута ShiftKey, Altkey и Ctrlkey.
Код заключается в следующем:
Кода -копия выглядит следующим образом:
var bshift = oevent.shiftkey;
var balt = oevent.altkey;
var bctrl = oevent.ctrlkey;
Кроме того, при получении указателей мыши методы, используемые обоими типами браузеров, одинаковы, оба из которых включают ClientX, Clienty, ScreenX и Screeny.
Среди них ClientX и клиент представляют местоположение мыши в области клиента и не включают в себя строку статуса браузера, строку меню и т. Д.
Код заключается в следующем:
Кода -копия выглядит следующим образом:
var iclientx = oevent.clientx;
var iclienty = oevent.clienty;
ScreenX и Screeny Относитесь к позиции мыши на экране всего компьютера, а код
Кода -копия выглядит следующим образом:
var iScreenx = oevent.screenx;
var Iscreeny = oevent.screeny;
Много раз разработчики хотят знать, что событие вызвано этим объектом, то есть целью события.
Предполагая, что элемент <p> выделяет функцию обработчика событий OnClick, <p> будет считаться целью при запуска событий Click.
В браузере IE цель содержится в свойстве Srcelement объекта события, код заключается в следующем
Кода кода выглядит следующим образом: var otarget = oevent.srcelement;
В стандартном браузере DOM цель включена в целевой атрибут, код выглядит следующим образом
Кода кода следующая: var otarget = oevent.target;
Получить цель мероприятия
Кода -копия выглядит следующим образом:
<script language = "javascript">
Функциональная ручка (oevent) {
var disp = document.getElementbyId ("display");
if (window.event) oevent = window.event; // обрабатывать совместимость и получить объект
var Otarget;
if (oevent.srcelement) // обрабатывать совместимость и получить события
otarget = oevent.srcelement;
еще
otarget = oevent.target;
Disp.InnerHtml + = "Имя элемента:" + otarget.tagname + "<br>" + "Содержание элемента:" + otarget.textcontent + "<br>"
+ "Узел сразу же следующим образом:" + otarget.textContent + "<br>"
;
}
window.onload = function () {
var op = document.getElementbyId ("box");
op.onclick = handle;
}
</script>
<div>
<div id = "box">
Содержание коробки
</div>
<p id = "display"> </p>
</div>
(Дополнение) Свойства объекта элемента http://www.w3school.com.cn/xmldom/dom_element.asp
(Дополнение) Методы объекта элемента http://www.w3school.com.cn/xmldom/dom_element.asp
Поскольку цель события отличается в двух типах браузеров, код должен обеспечить совместимость. Обычная практика состоит в том, чтобы напрямую использовать объект в качестве условия оператора IF. Код выглядит следующим образом
Кода -копия выглядит следующим образом:
if (oevent.srcelement)
otarget = oevent.srcelement;
еще
otarget = oevent.target;
Этот метод также обычно используется в других свойствах.