.undelegate()
Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements.
.undelegate()🡢 jQuery
.undelegate(selector, eventType)🡢 jQuery
selector
| String | A selector which will be used to filter the event results. |
eventType
| String | A string containing a JavaScript event type, such as "click" or "keydown" |
.undelegate(selector, eventType, function(eventObjectEvent))🡢 jQuery
selector
| String | A selector which will be used to filter the event results. |
eventType
| String | A string containing a JavaScript event type, such as "click" or "keydown" |
function(eventObjectEvent)
| Function | A function to execute at the time the event is triggered. |
.undelegate(selector, events)🡢 jQuery
selector
| String | A selector which will be used to filter the event results. |
events
| PlainObject | An object of one or more event types and previously bound functions to unbind from them. |
.undelegate(namespace)🡢 jQuery
namespace
| String | A string containing a namespace to unbind all events from. |
As of jQuery 3.0, .undelegate() has been deprecated. It was superseded by the .off() method since jQuery 1.7, so its use was already discouraged.
The .undelegate() method is a way of removing event handlers that have been bound using .delegate().
Can bind and unbind events to the colored button.
JS
<button id="theone">Does nothing...</button>
<button id="bind">Bind Click</button>
<button id="unbind">Unbind Click</button>
<div style="display: none">Click!</div>
CSS
button {
margin: 5px;
}
button#theone {
color: red;
background: yellow;
}
HTML
function aClick() {
$("div").show().fadeOut("slow");
}
$("#bind").click(function () {
$("body")
.delegate("#theone", "click", aClick)
.find("#theone")
.text("Can Click!");
});
$("#unbind").click(function () {
$("body")
.undelegate("#theone", "click", aClick)
.find("#theone")
.text("Does nothing...");
});
DEMO
To unbind all delegated events from all paragraphs, write:
HTML
$("p").undelegate();
DEMO
To unbind all delegated click events from all paragraphs, write:
HTML
$("p").undelegate("click");
DEMO
To undelegate just one previously bound handler, pass the function in as the third argument:
HTML
var foo = function () {
// Code to handle some kind of event
};
// ... Now foo will be called when paragraphs are clicked ...
$("body").delegate("p", "click", foo);
// ... foo will no longer be called.
$("body").undelegate("p", "click", foo);
DEMO
To unbind all delegated events by their namespace:
HTML
var foo = function () {
// Code to handle some kind of event
};
// Delegate events under the ".whatever" namespace
$("form").delegate(":button", "click.whatever", foo);
$("form").delegate("input[type='text'] ", "keypress.whatever", foo);
// Unbind all events delegated under the ".whatever" namespace
$("form").undelegate(".whatever");
DEMO