博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jQuery中的事件绑定的几种方式
阅读量:5164 次
发布时间:2019-06-13

本文共 1266 字,大约阅读时间需要 4 分钟。

jQuery目前有on(),bind(),delegate(),live()四种绑定方式,但是随着版本的不断更新,有的方式也相应的被淘汰掉

【band()方式绑定】

    3.0版本之前的绑定方式比较常用的是bind()绑定事件,解除事件的方式是unbind(),但是在3.0之后band()的绑定方式也别相应的解除掉了。bind()的事件绑定是只对当前页面选中的元素有效。如果你想对动态创建的元素bind()事件,是没有办法达到效果的,如下代码。

1  2  3  4  5  6 
7
我是原生div
8
9 10

delegate(),live()两种绑定方式并不太常用,因此推荐下面这种方式,on()绑定。

【on()事件绑定】

① 使用on进行单事件绑定

$("button").on("click",function(){

$(this) 取到当前调用事件函数的对象
console.log($(this).html());
});
 ② 使用on同时为多个事件,绑定同一函数
$("button").on("mouseover click",function(){
console.log($(this).html())
});
 ③ 调用函数时,传入自定义参数
$("button").on("click",{name:"jianghao"},function(event){
使用event.data.属性名 找到传入的参数
console.log(event.data.name);
})
④ 使用on进行多事件多函数绑定
$("button").on({
click:function(){
console.log("click")
},
mouseover:function(){
console.log("mouseOver")
}
});
⑤ 使用on进行事件委派
 >>> 将原本需要绑定到某元素上的事件,改为绑定在父元素乃至根节点上,然后委派给当前元素生效;
eg:$("p").click(function(){});
 $(document).on("click","p",function(){});
作用:
默认的绑定方式,只能绑定到页面初始时已有的p元素,当页面新增p元素时,无法绑定到新元素上;
使用事件委派方式,当页面新增元素时,可以为所有新元素绑定事件

off() 取消事件绑定

1. $("p").off(): 取消所有事件
2. $("p").off("click"): 取消点击事件
3. $("p").off("click mouseover"):取消多个事件
4. $(document).off("click","p"):取消事件委派

 

转载于:https://www.cnblogs.com/GlenLi/p/6886675.html

你可能感兴趣的文章
windows下的C++ socket服务器(4)
查看>>
css3 2d转换3d转换以及动画的知识点汇总
查看>>
【Java】使用Eclipse进行远程调试,Linux下开启远程调试
查看>>
对Vue为什么不支持IE8的解释之一
查看>>
计算机改名导致数据库链接的诡异问题
查看>>
Java8内存模型—永久代(PermGen)和元空间(Metaspace)(转)
查看>>
ObjectiveC基础教程(第2版)
查看>>
centos 引导盘
查看>>
Notes of Daily Scrum Meeting(12.8)
查看>>
Apriori算法
查看>>
onlevelwasloaded的调用时机
查看>>
求出斐波那契数组
查看>>
lr_start_transaction/lr_end_transaction事物组合
查看>>
CodeIgniter学习笔记(四)——CI超级对象中的load装载器
查看>>
.NET CLR基本术语
查看>>
ubuntu的home目录下,Desktop等目录消失不见
查看>>
建立,查询二叉树 hdu 5444
查看>>
[Spring框架]Spring 事务管理基础入门总结.
查看>>
2017.3.24上午
查看>>
Python-常用模块及简单的案列
查看>>