1. Пузырьковые события
Существует два типа моделей событий для браузеров: захват событий и событий пузырьков. Поскольку IE не поддерживает события захвата, в основном в качестве объяснения используется пузырьковые события.
(дублированный пузырь) Тип пузырька относится к наиболее конкретному событию на наименее конкретное событие, запускаемое одно за другим.
Кода -копия выглядит следующим образом:
<body onclick = "add ('body <br>')">
<div onclick = "add ('div <br>')">
<ponclick = "add ('p <br>')"> нажмите меня </p>
</div>
</body>
<div id = "display">
</div>
<script type = "text/javascript">
функция добавить (stext) {
var ulo = document.getElementById ("Display");
ulo.innerhtml += stext;
}
</script>
Вышеуказанные три функции добавили функцию OnClick. Три функции после автономного элемента P выпускаются. Элемент P сначала выполняется, затем DIV выполняется, и, наконец, тело выполнено.
Здесь здесь есть напоминание о событии захвата, и его порядок - именно противоположность событию пузырьков.
2. Мониторинг событий
Событие требует функции для ответа. Этот тип функции обычно называют обработчиком событий. С другой стороны, эти функции слушают в режиме реального времени, независимо от того, происходит ли событие, обычно называемое слушателем событий. Функция прослушивания событий совершенно отличается для разных браузеров.
я. Общий метод прослушивания, такой как использование метода OnClick, почти каждый тег поддерживает этот метод. И совместимость браузера очень высока
Учитывая поведение, разделение событий.
Как правило, монитор с использованием следующих методов
Кода -копия выглядит следующим образом:
<тело>
<div id = "me"> нажмите </div>
<script type = "text/javascript">
var opp = document.getElementById ("me"); // Событие найдено
OPP.Onclick = function () {// Установить функцию события
оповещение («Меня нажали!»)
}
</script>
</body>
Оба метода, представленные выше, очень удобны и любят разработчики Everbright при создании и обработке некоторых небольших функций. Но для того же события. Они могут добавить только одну функцию, такую как функция OnClick, помеченную P. Оба метода могут иметь только одну функцию. Поэтому IE имеет свое собственное решение, коллеги, и стандартный DOM предусматривает другой метод.
II Метод мониторинга в IE
В утреннем браузере каждый элемент имеет два метода для обработки времени прослушивания.
AttachEvent () и detachenevt () соответственно.
Как вы можете видеть из их имен функций, ATTRONEVT () - это функция, используемая для добавления обработки событий к элементу, в то время как DETACHEVENT () используется для удаления функции слушания на элементе. Их синтаксис выглядит следующим образом:
[Object] .AttachEvent ("enevt_handler", "fnhandler");
[объект] .detachevent ("enevt_handler", "fnhandler");
Среди них enevt_handler представляет обычно используется OnClick, Onload, OnmouseOver и т. Д.
Fnhandler - это имя функции слушателя.
В предыдущем разделе вы можете использовать метод AttlevEvent () вместо добавления функции слушания. Когда вы нажимаете по нему, вы можете использовать DetachEvent (), чтобы удалить функцию прослушивания, чтобы она не была выполнена после следующего щелчка.
Кода -копия выглядит следующим образом:
<script type = "text/javascript">
функция fnclick () {
оповещение («Меня щелкнули!»);
op.detachevent ("onclick", "fnclick");
}
var op;
window.onload = function () {
op = document.getElementbyId ("OOP"); // найти объект
op.attachevent ("onclick", "fnclick"); // Добавить функцию слушателя
}
</script>
<div>
<p id = "oop">
</p>
</div>
iii. Добавить несколько событий прослушивания (т.е.)
Кода -копия выглядит следующим образом:
<script language = "javascript">
функция fnclick1 () {
оповещение («Меня нажали FnClick1»);
}
функция fnclick2 () {
оповещение («Меня нажали fnClick2»);
//op.detachevent("onclick",fnclick1); // Удалить функцию прослушивателя 1
}
var op;
window.onload = function () {
op = document.getElementbyId ("myp"); // найти объект
op.attachevent ("onclick", fnclick1); // Добавить функцию слушателя 1
op.attachevent ("onclick", fnclick2); // Добавить функцию слушателя 2
}
</script>
</head>
<тело>
<div>
<p id = "myp"> щелкните меня </p>
</div>
3. Стандартный мониторинг событий DOM
С двумя методами IE, стандартный DOM также использует два метода для добавления и удаления функции слушателя соответственно. то есть addEventListener () и removeEventListener ()
В отличие от IE, эти две функции принимают 3 параметра, а именно имя события, имя функции, которая будет назначена, и используется ли она для стадии пузыря или стадии захвата. Параметры стадии захвата верны, а параметры стадии пузыря ложны. Синтаксис выглядит следующим образом:
Кода -копия выглядит следующим образом:
[Object] .AdDeventListener ("Event_Name", fnhandler, bcapture);
[Object] .ReMoveEventListener ("Event_Name", fnhandler, bcapture);
Методы использования этих двух функций в основном похожи на IE, но вы должны отметить, что название Event_Name - «щелчок», «MouseOver» и т. Д., А не «OnClick» и «OnmouseOver» в IE.
Кроме того, третий параметр Bcapture обычно устанавливается на ложную, на стадии пузырьков.
Стандартный метод прослушивания событий DOM:
Кода -копия выглядит следующим образом:
<script language = "javascript">
функция fnclick1 () {
оповещение («Меня нажали 1»);
op.removeeventlistener ("click", fnclick1, false);
}
функция fnclick2 () {
оповещение («Меня нажали 2»);
}
window.onload = function () {
op = document.getElementbyId ("myp");
Op.AddeventListener («щелчок», fnclick1, false);
Op.AddeventListener («щелкнуть», fnclick2, false);
}
</script>
<div>
<p id = "myp"> щелкните меня </p>
</div>
Вы можете проверить конкретный заказ на выполнение.
Выше приведено в этой статье, надеюсь, вам понравится.