Application development and sharing our knowledge to developer to developer for helping knowledge to build a effective solution for web architect.
Pages
▼
Friday, February 28, 2014
jquery Understanding Event Delegation
The delegate() method attaches one or more event handlers for specified elements
that are children of selected elements,
and specifies a function to run when the events occur.
Event handlers attached using the delegate() method will work for both current and FUTURE elements (like a new element created by a script).
When a <p> element inside a <div> element is clicked, change the background color of all <p> elements:
Try it yourself »
Event handlers attached using the delegate() method will work for both current and FUTURE elements (like a new element created by a script).
As of jQuery version 1.7, the on() method is the preferred method for attaching event handlers for selected elements.
When a <p> element inside a <div> element is clicked, change the background color of all <p> elements:
$("div").delegate("p","click",function(){
$("p").css("background-color","pink");
});
$("p").css("background-color","pink");
});
Try it yourself »
Syntax
$(selector).delegate(childSelector,event,data,function)
| Parameter | Description |
|---|---|
| childSelector | Required. Specifies one or more child elements to attach the event handler to |
| event | Required. Specifies one or more events to attach to the elements. Multiple event values are separated by space. Must be a valid event |
| data | Optional. Specifies additional data to pass along to the function |
| function | Required. Specifies the function to run when the event occurs |