Did you find this useful?
Socialize it today.


jQuery Undelegate Event

Thursday, July 05, 2012

The jQuery event undelegate() method removes one or more event handlers for specified elements that are children of selected elements, and specifies a function to run when the events occur. In addition, event handlers that are removed using the jQuery undelegate() method will work for both current and future elements. As of jQuery 1.7, the undelegate() method has been superseded by the .off() method. For earlier versions, it remains the most effective means to use event delegation.


Syntax

$(selector).undelegate(selector,event,function)


ParameterDescription
selectorOptional selector to remove event handlers from
eventOptional events to remove.
functionOptional function to remove


Example

In the following jQuery example, the undelegate() method removes the click event from the div element. When the "imgUndelegate" element is clicked, the slideToggle effect is removed from click event attached to the "imgMouse" element. In this example, the div element will be shown or hidden as the mouse icon is clicked. Clicking the Undelegate image removes this event. Try it yourself, by clicking the mouse icon first, then the Undelegate image.


<div id="divParent">
    <img id="imgMouse"src="#" />
    <img id="imgUnbind"src="#" />
    <div id="divChild">
    <div id="divText">Click the mouse icon to toggle ....
         </div>
</div>

$("#divParent").delegate("img", "click", function () {
    $("#divChild").slideToggle();
     });
$("#imgUndelegate").click(function () {
    $("div").undelegate();
     });


mouse close
Click the mouse icon to toggle this display, or click the X to undelegate the events!

Please help us spread the word by socializing it today!

email contact us

Did you find something wrong with the information on this page? Please take a moment to report it to us so that we can continue to improve the quality of the information on this site. Click here to report an issue with this page.



Recommended Books & Training Resources

HTML CSS and JavaScript Editor JavaScript and jQuery: The Missing Manual Professional jQuery