JS Registration/Removal Event handler (ExtJS application design combat) _javascript Tips

Source: Internet
Author: User
The most common thing to do when designing ExtJS applications is registering event handlers, because in the ExtJS world, it's almost entirely time. As a result, ExtJS designers make registering events very easy (while also providing a very difficult way to choose from)--on/un, which is either up to the next two ways, or all subclasses of AddListener and removelistener,element can be used. For example, there is a <div/> want to give simple feedback when a user presses:
<divid= "Happydiv" class= "Happystyle"/>
How do I register the mouse click event for this <div/>? First you must obtain the element instance of this div:
Varhappydiv=ext.get (' Happydiv ');
Then you define an event handler:
Copy Code code as follows:

Varclickhandler=function (Event,eventtarget) {
Ext.MessageBox.alert ("Click", "youclicked:" +eventtarget.id);
}

Then use on () to connect the event handler function to the element instance:
Copy Code code as follows:

Happydiv.on (' click ', ClickHandler);

When the program executes, click <div/> the results shown in Figure 3-15 appear.
It's simple, isn't it? The sample file is ch03/event_demo.html. If you want to remove this event handler, simply change on () to UN (). There is no correlation between the event handlers that are not corresponding to the click event when they are removed, and the bottom EventManager will judge for themselves. When an event handler is invoked, it receives three parameters--event, Eventtarget, and Optionobj, with only two in the example, and a third parameter that is described when the EventManager is discussed. Here the focus is on event and Eventtarget, and the type of event is ext.event,eventtarget HTML element. The browser triggers the Click event when the user presses <div/> and calls Clickhanlder (), and for Clickhanlder (), the event that is received is the Click event triggered by the browser. Evnettarget is the event target, that is, the <div/>,eventtarget.id value is "Happydiv". As for the root class of the event, where should I go to find it? Answer

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.