Home > Developer > JavaScript
First, the incident
Ii. Flow of events
See the following: JavaScript event (i) Event flow
Third, event processing procedures
Four, IE event processing program
See JavaScript event (ii) event handlers for the above contents
V. Event object
1. Understanding Event Objects
Events exist in the browser as objects, that is, event. Triggering an event generates an event object that contains all the information related to the event . Includes the element that caused the event, the type of event, and other information related to the specific event.
For example, the event generated by the mouse operation contains information about the position of the mouse, and the event generated by the keyboard operation contains information about the key that was pressed.
All browsers support the event object, but in a different way, the event object in the DOM must be passed as a unique parameter to the events handler, in IE the event is a property of the Window object.
2. Event in the HTML events handler
<id= "btn" type= "button" value= "click" OnClick= "console.log (' HTML event handler ' +event.type)"/>This creates a function that contains the local variable event. Event objects can be accessed directly through the events.
3. Event objects in the DOM
Event handlers at both the DOM0 and DOM2 levels pass events as arguments.
<Body><inputID= "BTN"type= "button"value= "click"/><Script> varbtn=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, the event object in IE
The first case: When you add an event handler by using the DOM0-level method, there is an event object as a property of the Window object.
<Body><inputID= "BTN"type= "button"value= "click"/><Script> varbtn=document.getElementById ("btn"); Btn.onclick= function () { varEvent=window.event; Console.log (Event.type); //Click }</Script></Body>
The second case: The event object is passed in as a parameter by adding a attachevent () handler.
<Body><inputID= "BTN"type= "button"value= "click"/><Script> varbtn=document.getElementById ("btn"); Btn.attachevent ("onclick", function(type) {Console.log (event.type); //Click })</Script></Body>
But I have two places I don't know.
1, the event handler that is added through the DOM0-level method can also pass in an events parameter, its type and window.event.type, but the incoming event parameter is not the same as window.event, why?
btn.onclick= function (event) { var event1=window.event; Console.log (' event1.type= ' +event1.type); Event1.type=click console.log (' event.type= ' +event.type); Event.type=click console.log (' event1==event? ') + (EVENT==EVENT1)); Event1==event?false }2. Events and window.event that are passed into the event handlers added through Attachevent are not the same, why?
<Body><inputID= "BTN"type= "button"value= "click"/><Script> varbtn=document.getElementById ("btn"); Btn.attachevent ("onclick", function(type) {Console.log (event.type); //ClickConsole.log ("event==window.event?"+(Event==window.event)); //Event==window.event?false })</Script></Body>
Cond...
JavaScript event (iii) Event object
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
