最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

详解jQuery.unbind()函数的用法及注意点

来源:动视网 责编:小采 时间:2020-11-27 20:18:40
文档

详解jQuery.unbind()函数的用法及注意点

详解jQuery.unbind()函数的用法及注意点:unbind()函数用于移除匹配元素上绑定的一个或多个事件的事件处理函数。unbind()函数主要用于解除由bind()函数绑定的事件处理函数。该函数属于jQuery对象(实例)。语法unbind()函数主要有以下两种形式的用法:用法一:jQueryObject.unbind(
推荐度:
导读详解jQuery.unbind()函数的用法及注意点:unbind()函数用于移除匹配元素上绑定的一个或多个事件的事件处理函数。unbind()函数主要用于解除由bind()函数绑定的事件处理函数。该函数属于jQuery对象(实例)。语法unbind()函数主要有以下两种形式的用法:用法一:jQueryObject.unbind(


unbind()函数用于移除匹配元素上绑定的一个或多个事件的事件处理函数。

unbind()函数主要用于解除由bind()函数绑定的事件处理函数。

该函数属于jQuery对象(实例)。

语法

unbind()函数主要有以下两种形式的用法:

用法一:

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

移除当前匹配元素的events事件绑定的事件处理函数handler。

用法二:

jQueryObject.unbind( eventObject )

为指定事件处理函数传入的Event对象,用于移除对应的事件处理函数。

参数

参数 描述

events 可选/String类型一个或多个用空格分隔的事件类型和可选的命名空间,例如"click"、"focus click"、"keydown.myPlugin"。

handler 可选/Function类型指定的事件处理函数。

eventObject Object类型一个Event对象,用于移除传入该对象的事件处理函数。

jQuery 1.4.3 新增支持参数handler可以为false。用于移除绑定事件时,handler参数为false值的事件处理函数。

如果省略参数handler,则移除匹配元素指定类型的事件上绑定的所有事件处理函数。

如果省略了所有参数,则表示移除匹配元素上为任何元素绑定的任何事件类型的任何事件处理函数。

返回值

unbind()函数的返回值为jQuery类型,返回当前jQuery对象本身。

实际上,unbind()函数的参数全是筛选条件,只有匹配所有参数条件的事件处理函数都将被移除。参数越多,限定条件就越多,被移除的范围就越小。

示例&说明

请参考下面这段初始HTML代码:

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

首先,我们为上述button和<a>元素绑定事件,然后使用unbind()函数解除事件绑定,相应的代码如下:

function btnClick1(){
 alert( this.value + "-1" );
}
function btnClick2(){
 alert( this.value + "-2" );
}
var $buttons = $(":button");
// 为所有button元素的click事件绑定事件处理函数btnClick1
$buttons.bind( "click", btnClick1 );
// 为所有button元素的click事件绑定事件处理函数btnClick2
$buttons.bind( "click", btnClick2 );
// 为所有a元素的click、mouseover、mouseleave事件绑定事件处理函数
$("a").bind( "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.unbind("click", btnClick2);
// 移除为所有button元素的click事件绑定的所有事件处理函数(btnClick1和btnClick2)
// 点击按钮,不会执行任何事件处理函数
// $buttons.unbind("click");
// 只移除为btn1元素的click事件绑定的所有事件处理函数
 // btn2元素的click事件仍然有效
// $("#btn1").unbind("click");
// 移除为所有a元素的任何事件绑定的所有处理函数
// 点击链接,或用鼠标在链接上移入、移出,都不会触发执行任何事件处理函数
// $("a").unbind( );

unbind()函数还可以根据传入的事件对象来移除函数。以下jQuery代码只允许第一次点击按钮【点击1】时弹出提示框,之后立即移除该点击事件。

var $btn1 = $("#btn1");
$btn1.bind("click", function(event){
 alert("只执行一次!");
 $(this).unbind( event ); // 移除当前事件处理函数 
});
此外,unbind()函数还可以只移除指定命名空间的事件绑定。
var $buttons = $(":button");
// 为所有button元素的click事件绑定事件处理函数
$buttons.bind( "click.foo.bar", function btnClick1(){
 alert( "click-1" );
} );
// 为所有button元素的click事件绑定事件处理函数
$buttons.bind( "click.test.bar", function btnClick1(){
 alert( "click-2" );
} );
// 移除包含命名空间foo的click事件绑定的事件处理函数
$buttons.unbind( "click.foo" ); // 移除click-1
//移除包含命名空间bar的click事件绑定的事件处理函数
// $buttons.unbind( "click.bar" ); // 移除click-1和click-2
//移除包含命名空间test的click事件绑定的事件处理函数
// $buttons.unbind( "click.test" ); // 移除click-2
// 移除所有button元素的click事件绑定的所有事件处理函数
// $buttons.unbind("click"); // 移除click-1和click-2

文档

详解jQuery.unbind()函数的用法及注意点

详解jQuery.unbind()函数的用法及注意点:unbind()函数用于移除匹配元素上绑定的一个或多个事件的事件处理函数。unbind()函数主要用于解除由bind()函数绑定的事件处理函数。该函数属于jQuery对象(实例)。语法unbind()函数主要有以下两种形式的用法:用法一:jQueryObject.unbind(
推荐度:
标签: 使用 详解 函数
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top