The javascript event Delegate is bound to the on, off, one, and javascriptjquery events.
I. Event Delegation
What is event delegation? In reality, 100 students receive express deliveries at noon one day,
If 100 students cannot stand at the school gate at the same time, they will entrust the guard to collect the information and then hand it over to the students one by one.
In jQuery, we use the event bubbling feature to let the events bound to the child element bubble to the parent element (or the ancestor element)
And then proceed with the relevant processing.
If an enterprise-level application performs report processing, the table contains 2000 rows and each row has a button for processing. If you use
Before. bind () processing, we need to bind 2000 events, like 2000 students standing at the school gate at the same time.
Express Delivery will continue to block intersections, and there will be various accidents. This is also the case on the page, which may cause the page
Extremely slow or directly abnormal. In addition, the. bind () method cannot be dynamically bound if the 2000 buttons use ajax paging.
Element that does not exist. For example, if a new transfer student cannot verify his identity, the courier may not receive the courier.
// HTML part
<Div> <input id = "a" type = "button" value = "button 1"> <input id = "a" type = "button" value =" button 2 "> </div>
JQuery code:
$ ('Div '). click (function (e) {alert ('event type: '+ e. type + ', Value:' + parameters (e.tar get ). val ());})
Click button 1:Event Type: click, Value: button 1.
Note: For example, clickdeskmousedowndemoe.tar get returns the jQuery object that triggers the event.
4. A javascript online testing tool is recommended. You can select a JQuery library to test html, css, and js Code.
Http://jsfiddle.net
Javascript cannot use jquery if the click event is activated.
There are four methods:
1. Write The onclick event directly.
<Div onclick = "alert ('A');"> point </div> 2. Redefine the onclick event
ADom. onclick = function () {//...} 3. New event (IE)
ADom. attachEvent ("onclick", function () {//...}); 4. Add events (Chrome, Firefox, etc)
ADom. addEventListener ("click", function (){//...});
In addition, jQuery has three methods: click, on, and bind.
How does JavaScript/Jquery prevent event appending? (Not event bubbling)
$ (Function () {$ ("# green "). click (function (event) {// This line of code can solve your problem event. stopImmediatePropagation (); alert ("green click1") ;}); $ ("# green "). click (function () {alert ("green click2 ");});});