Связанные показания:
JavaScript Event Superaint Support (v) Тип событий мыши в JS
//www.vevb.com/article/86259.htm
JavaScript Event Superaint Support (i) Поток событий
//www.vevb.com/article/86261.htm
JavaScript Event Learning Redugary (IV) Общественные члены событий (свойства и методы)
//www.vevb.com/article/86262.htm
JavaScript Event Superaint Support (II) Обработчик событий JS
//www.vevb.com/article/86264.htm
JavaScript Event Superaint Support (III) JS -объект события
//www.vevb.com/article/86266.htm
1. Объект события
1. Понять объект события
События существуют в браузере как объекты, то есть событие. Запуск события будет генерировать событие объекта события, которое содержит всю информацию, связанную с событием. Включает элементы, которые приводят к событию, типу события и другую информацию, связанную с конкретным событием.
Например: событие, сгенерированное операцией мыши, будет содержать информацию о положении мыши; Событие, сгенерированное операцией клавиатуры, будет содержать информацию, связанную с нажатой клавиш.
Все браузеры поддерживают объекты события, но методы поддержки различны. В DOM объекты события должны быть переданы функциям обработки событий в качестве уникальных параметров. В IE событие является атрибутом оконных объектов.
2. Событие в обработчике HTML Event
<input id = "btn" type = "cutton" value = "chlick" onclick = "console.log ('html event handler'+event.type)"/>Это создает функцию, содержащую локальную переменную событие. Объект события можно получить непосредственно через событие.
3. Объекты события в DOM
Обработчики событий на уровне DOM0 и DOM2 будут передавать событие в качестве параметров.
<body> <input id = "btn" type = "button" value = "click"/> <script> var btn = document.getElementById ("btn"); btn.onclick = function (event) {console.log ("dom0 & click"); console.log (event.type); //click >btn.addeventlistener("click ", function (event) {console.log (" dom2 & click "); console.log (event.type); // click}, false); </script> </body>4. Объекты событий в т.е.
Первый случай: при добавлении обработчика событий через метод DOM0 объект события существует как атрибут объекта Window.
<body> <input id = "btn" type = "button" value = "click"/> <script> var btn = document.getElementByid ("btn"); btn.onclick = function () {var event = window.event; console.log (event.type); // Нажмите} </script> </body>Второй случай: обработчик событий добавил через AttedEvent (), а объект события передается в качестве параметра.
<body> <input id = "btn" type = "button" value = "click"/> <script> var btn = document.getElementbyid ("btn"); btn.attachevent ("onclick", function (type) {console.log (event.type); // click}) </script> </body>Но я не понимаю двух вещей.
1. Параметр события также может быть передан в обработчик событий, добавленный через метод уровня DOM0. Его тип такой же, как window.event.type, но параметр события, пройденное, отличается от Window.event. Почему?
btn.onclick = function (event) {var event1 = window.event; console.log ('event1.type ='+event1.type); //event1.type=clickconsole.log('event.type='+Event.type); //event.type=clickconsole.log(''event1===Event?'+(Event==EVENT1)); // Event1 == Event? FALSE}2. Событие, прошедшее в обработчике событий, добавленным через AttactEvent, отличается от Window.event. Почему?
<body> <input id = "btn" type = "button" value = "click"/> <script> var btn = document.getElementByid ("btn"); btn.attachevent ("onclick", function (type) {console.log (event.type); //clickconsole.log("event==window.event?"+(Event==window.event));Выше приведено резюме JavaScript Event Learning (III), связанные с объектами событий JS, представленными редактором. Я надеюсь, что это будет полезно для всех. Если вы хотите узнать больше, обратите внимание на веб -сайт wulin.com!