jQuery---解除事件

php数组中增加元素的方法:1、使用array_unshift()函数,向数组头插入新元素;2、使用array_push()函数,向数组末尾插入一个或多个新元素;3、使用array_splice()函数,向数组任意位置插入新元素。

一、常用解除绑定事件

举例:

//绑定事件,使用id选择器给btn1绑定点击事件
$("#btn1").click(function(){
	console.log("点击事件")
}).mouseenter(function(){
	console.log("鼠标聚焦事件")
})
			
//点击第二个按钮,解除第一个按钮事件
$("#btn2").click(function(){
       //这里是解绑函数,使用off函数,可以添加参数解绑一个绑定事件,或者不加参数,默认都解绑
	$("#btn1").off("mouseenter");  
	console.log("第一个按钮事件解绑")
})

效果显示:

jQuery---解除事件

二、on函数解除绑定事件

$(“父节点选择器”).delegate(“孩子节点,即要绑定的元素”,“事件名称”,匿名函数)

举例:

//绑定事件,使用id选择器给btn1绑定点击事件
$("#btn1").on("click",function(){
	console.log("点击事件")
}).on("mouseenter",function(){  //注意这里的on函数的链式编程
	console.log("鼠标聚焦事件")
})
			
//点击第二个按钮,解除第一个按钮事件
$("#btn2").click(function(){
	$("#btn1").off("mouseenter");      //这里是解绑函数,使用off函数,
	console.log("第一个按钮聚焦事件解绑")
})

效果展示:

jQuery---解除事件

三、bind函数解除绑定事件

$("#btn1").bind({"click":function(){
	console.log("点击事件")
},
"mouseenter":function(){
	console.log("鼠标聚焦事件")
},
"mouseleave":function(){
	console.log("鼠标离焦事件")
}})		
			
$("#btn2").bind("click",function(){
	$("#btn1").unbind("click");   //unbind解除了所有的绑定事件
	console.log("解除点击事件")
})

效果展示:

jQuery---解除事件

$(“父节点选择器”).delegate(“孩子节点,即要绑定的元素”,“事件名称”,匿名函数)

思考

在PHP中可以使用内置函数rand()、mt_rand()来随机生成一个数

$("#btn1").on("click",function(){
	console.log("点击事件")
}).on("mouseenter",function(){ 
	console.log("鼠标聚焦事件")
}).on("mouseleave",function(){  //注意这里的on函数的链式编程
	console.log("鼠标失焦事件")
})
			
$("#btn2").bind("click",function(){
	$("#btn1").unbind("click");   //unbind解除了所有的绑定事件
	console.log("解除点击事件")
})

效果展示:

jQuery---解除事件

四、delegate函数解除绑定事件

$(“父节点选择器”).delegate(“孩子节点,即要绑定的元素”,“事件名称”,匿名函数)

举例:

$("div").delegate("p","click",function(){
	console.log("p标签---鼠标-点击-事件")
}).delegate("p","mouseenter",function(){
	console.log("p标签---鼠标-聚焦-事件")
}).delegate("button","mouseenter",function(){
	console.log("按钮---鼠标-聚焦-事件")
}).delegate("button","click",function(){
	console.log("按钮---鼠标-点击-事件")
})
			
$("#btn2").click(function(){
	$("div").undelegate("button","click")
	console.log("button解除点击事件")
})

效果展示:

jQuery---解除事件

五、总结

函数备注
off(“事件名称”)写一个参数,解除该标签的指定事件
off()不写参数,解除该标签的所有事件
unbind(“事件名称”)写一个参数,解除该标签的指定事件
unbind()不写参数,解除该标签的所有事件
undelegate(“标签名称”,“事件名称”)写两个参数,解除指定标签类的指定事件
undelegate()不写参数,解除父标签下的所有标签的所有事件

以上例子中涉及的绑定事件以及链式编程,可以参看我的其他两篇文章《jQuery—绑定事件》《jQuery—链式编程》

本资源由随笔博客发布。发布者:五维国度,转载请注明出处:http://blog.suibi.site/archives/4183


本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

(0)
上一篇 2022年 11月 16日 上午10:30
下一篇 2022年 11月 16日 下午2:34

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注

联系我们

在线咨询: QQ交谈

邮件:jctestxcx@163.com

关注微信