Detailed examples of jQuery.die() function usage

The

die() function is used to remove the event handling function of one or more events bound to the matching element.

The die() function is mainly used to unblock the event processing function bound by the live() function.

This function belongs to the jQuery object (instance).

Syntax

This function was added in jQuery 1.3. It was marked as obsolete starting from jQuery 1.7 and was removed in jQuery 1.9. It mainly has the following two forms of usage:

Usage 1: jQuery 1.4.1 newly supports not specifying any parameters.

jQueryObject.die( [ events [, handler ]] )

Remove the event handler function handler bound to the events event of the element matching the current selector.

Usage 2: jQuery 1.4.3 newly supports this usage.

jQueryObject.die(eventsMap)

Variation of usage one, used to remove multiple event handlers of multiple event types at the same time. eventsMap is an object, each attribute is applied to the parameter events in method 1, and the value is applied to the parameter handler in method 1.

Parameters

Parameter Description

events Optional/String type One or more event types separated by spaces and optional namespace, For example "click", "focus click", "keydown.myPlugin".

handler Optional/event handling function specified by Function type.

eventsMap Object class is a type Object object, each of its attributes corresponds to the event type and optional namespace (parameter events), and the attribute value corresponds to the bound Event handling function (parameter handler).

namespace Namespace specified by String type, such as ".foo", ".myPlugin".

If the parameter handler is omitted, all event handlers bound to events of the specified type matching the element will be removed.

The selector of the current jQuery object that calls the die() function must be consistent with the selector of the jQuery object that calls the live() function.

If all parameters are omitted, it means to remove any event handlers on the matching element for any event type bound to any element.

Return value

die()The return value of the function is of jQuery type and returns the current jQuery object itself.

In fact, the parameters of the die() function are all filtering conditions, and only event processing functions that match all parameter conditions will be removed. The more parameters there are, the more qualifications there are and the smaller the range that is removed.

Example & Description

Please refer to the following initial HTML code:

<input id="btn1" type="button" value="点击1" />
<input id="btn2" type="button" value="点击2" />
<a id="a1" href="#">CodePlayer</a>

First, we bind events to the above button and elements, and then use die () function to unbind the event, the corresponding code is as follows:

function btnClick1(){
    alert( this.value + "-1" );
}
function btnClick2(){
    alert( this.value + "-2" );
}
var $buttons = $(":button");
// 为所有button元素的click事件绑定事件处理函数btnClick1
$buttons.live( "click", btnClick1 );
// 为所有button元素的click事件绑定事件处理函数btnClick2
$buttons.live( "click", btnClick2 );
// 为所有a元素绑定click、mouseover、mouseleave事件
$("a").live( "click mouseover mouseleave", function(event){
    if( event.type == "click" ){
        alert("点击事件");
    }else if( event.type == "mouseover" ){
        $(this).css("color", "red");
    }else{
        $(this).css("color", "blue");       
    }
});
// 移除所有button元素的click事件绑定的事件处理函数btnClick2
// 点击按钮，只执行btnClick1
$buttons.die( "click", btnClick2 );
// 移除所有button元素的click事件绑定的所有事件处理函数(btnClick1和btnClick2)
// 点击按钮，不会执行任何事件处理函数
// $buttons.die("click");
//注意： $("#btn1").die("click"); 无法移除btn1的点击事件，调用die()函数的jQuery对象的选择器与调用live()函数的jQuery对象的选择器必须一致。
// 移除所有a元素的任何事件绑定的所有处理函数
// $("a").die( );

In addition, the die() function can also remove only the event binding of the specified namespace.

var $buttons = $(":button");
// 为所有button元素的click事件绑定事件处理函数
$buttons.live( "click.foo.bar", function btnClick1(){
    alert( "click-1" );
} );
// 为所有button元素的click事件绑定事件处理函数
$buttons.live( "click.test.bar", function btnClick1(){
    alert( "click-2" );
} );
// 移除包含命名空间foo的click事件绑定的事件处理函数
$buttons.die( "click.foo" ); // 移除click-1
//移除包含命名空间bar的click事件绑定的事件处理函数
// $buttons.die( "click.bar" ); // 移除click-1和click-2
//移除包含命名空间test的click事件绑定的事件处理函数
// $buttons.die( "click.test" ); // 移除click-2
// 移除所有button元素的click事件绑定的所有事件处理函数
// $buttons.die("click"); // 移除click-1和click-2

The above is the detailed content of Detailed examples of jQuery.die() function usage. For more information, please follow other related articles on the PHP Chinese website!