jquery中bind与on的区别

最新推荐文章于 2024-07-05 15:50:42 发布
最新推荐文章于 2024-07-05 15:50:42 发布
阅读量392 收藏
点赞数
本文详细介绍了JavaScript中bind方法与on方法的区别，重点解释了on方法支持的事件委托特性，这是一种通过父元素监听子元素事件的技术，有助于减少资源消耗。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

bind方法与on方法都是事件绑定，但是两者却又有着一个大区别：事件委托

on方法多了一个selector方法，也就是子类选择器

事件委托就是子类的事情委托给父类的去做，而这就让我们想起了冒泡事件，是的，这的确是委托事件的原型，而我们的selector，则是判断是不是那个子元素触发的事件，如果不是，自然就忽略掉了

这是个最简单的委托事件，按钮将事件委托给了父亲节点---div，所以点击btn后我们触发的是按钮，委托的对象===div内部的事件就触发了，
事件委托有个很好的优点，就是不用多次去绑定一个事件，比如一个有着999条新闻的新闻列表，当我们绑定999次的时候，会耗费很多资源，而一次事件委托就足够了


 

陆小曼啊
关注
jQuery中 on 和 bind的区别
by123asdf的博客
11-05 1171
jQuery中 on 和 bind 的区别 先看参数 1.bind有三个参数，分别是event，data，function，也就是事件，额外要添加的数据以及执行函数 2.on有四个参数，分别是event，selector, data，function 分别是事件，选择器，额外添加的数据和执行函数。 首先啊，有没有发现，多了一个选择器. 我们来举个场景的例子 一个大的dom节点里有两个小的节点，比如一个class1，一个class2.所以你会这样写 var x = docuemnt.getElementB
jQuery中的on与bind绑定事件区别实例详解
10-20
在jQuery中，`on`和`bind`都是用于绑定事件处理函数的方法，但它们之间存在一些关键的区别，尤其是在处理动态添加元素和事件冒泡方面。...希望本文的讲解能帮助你更好地理解和应用jQuery中的`on`与`bind`。
jquery绑定事件 bind和on的用法与区别分析
11-20
本文实例讲述了jquery绑定事件 bind和on的用法与区别。分享给大家供大家参考，具体如下： bind和on都是给元素绑定事件用的,其最大的区别就是事件冒泡 事件冒泡也是委托事件的原型，事件委托就是子类的事情委托给父类的去做 最直观的区别就是on绑定比bind绑定多一个参数‘childSelector’ 语法 $(selector).on(event,childSelector,data,function) 参数 描述 event 必需。规定要从被选元素移除的一个或多个事件或命名空间。 由空格分隔多个事件值，也可以是数组。必须是有效的事件。 childSelect
jQuery bind和on的区别
一颗帅白菜的博客
04-14 686
2.采用事件委托机制, 不是直接为p元素绑定事件，而是为其父元素（或祖先元素也可）绑定事件，当在div内任意元素上点击时，事件会一层层从event target向上冒泡，直至到达你为其绑定事件的元素, 就会执行事件.如果事件目标在DOM树中很深的位置，这样一层层冒泡上来查找与选择器匹配的元素，又会影响到性能.1.bind有三个参数，分别是event，data，function，也就是事件，额外要添加的数据以及执行函数。, data，function 分别是事件，选择器，额外添加的数据和执行函数。
jquery bind on 区别
document_ljt的博客
08-23 610
on 和 bind 用法 bind(type,click,fn) on(type,[selector],click,fn) 用 on绑定事件可以设置 selector可以阻止时间冒泡 bind则不可行    
Jquery中.bind()、.live()、.delegate()和.on()之间的区别详解
10-19
在我们日常开发中经常会使用到.bind()、.live()、.delegate()和.on()，有些同学会对这四者存在一些疑虑，所以下面这篇文章主要给大家介绍了关于Jquery中.bind()、.live()、.delegate()和.on()之间区别的相关资料，...
jquery on和bind的区别
jontyy的博客
12-23 3364
jquery on和bind的区别 Introduce 在jquery插件库下了很多别人写的轮播图源码，就那么傻乎乎的翻一翻，有些代码写的惨不忍睹，有些代码看着看着就让人忍不住拍案叫绝。 在查看源码的时候，发现了一些自己掌握的不熟的知识点，比如题目的on和bind Others 先随便说一说，这里的bind 和javascript的绑定this指针的bind不一样， 后期有时间我会好好整理b...
jQuery中bind和on的区别
最新发布
weixin_62731214的博客
07-05 456
on有四个参数，分别是event，selector, data，function 分别是事件，选择器，额外添加的数据和执行函数。
JQuery事件绑定函数：on()与bind()的差别
热门推荐
aty
02-09 1万+
JQuery从1.7+版本开始，提供了on()和off()，进行事件处理函数的绑定和取消。这2个API与JQuery最初提供的bind()和unbind()有很多相似的地方，也有一些不同之处。bind和unbind的详细介绍，可以参考这篇文章。   on()和bind()的函数签名如下： bind(type, [data], fn) on(type,[selector],[data],fn
bind()和on()的区别
mjj530069829的博客
08-16 967
转载一篇两者的区别，共享 1：bind()：为每个匹配元素的特定事件绑定事件处理函数。　　bind(type,[data],fn)　　type: 含有一个或多个事件类型的字符串，由空格分隔多个事件。　　比如"click"或"submit"，还可以是自定义事件名。　　data:作为event.data属性值传递给事件对象的额外数据对象　　fn:绑定到每个匹配元素的事件上面的处理函数　　2：on
JQuery的on和bind
Jesse_cool的博客
07-26 539
html lang="zh"> head> title>Documenttitle> head> body> ul id="u1"> li>clickli> li>clickli> li>clickli> ul> ul id="u2"> li>clickli> li>clickli> li>clickli> ul>
jquery中bind和on的区别
weixin_30549175的博客
06-13 158
1.首先，来看看bind和on的语法。 bind的用法： $('a').bind('click',[data],function(){}) 其事件的绑定者是固定的，就是a,第一个参数是事件，第二个参数可选，是要传递给回调函数的event.data参数，第三个参数是回调函数。例如： on的用法： on:$('body').on('click','a',[data],function(){...
JQuery的on和bind的区别
lanhezhong的博客
03-06 1680
在js中为某个元素绑定事件时，我们常用到on函数和bind函数，两个函数有什么区别，什么时候用哪个函数，今天脑残小编简单介绍一下，不喜勿喷； 长话短说进入正题. 先看两个方法的写法 $("body").on("click", ".button", function(){ //do something }) $("body .button").bind("click", function(){...
bind和on的区别
地铁和人海
08-05 986
11111
Jquery中bind绑定和on绑定的区别
高先生的猫
07-02 318
定义：从jquery1.7后推荐使用on绑定事件，on()是bind(), live(), delegate()方法的替代品。 注意：值得注意的是：on不仅仅作用于当前绑定的元素，对于未来有脚本语言创建的元素也会有同样的作用。 移除：如果要移除on()事件，请是用off(); 使用场景：在我的项目中有这样的一种情况，需要动态的添加列表的元素。我在添加元素的时候每次都要为添加的元素bind相应的click等方法。这很让人烦恼，有没有执行一次就可以自动为我没次添加的元素绑定相应的事件呢？ 只要你是用的是
on()和bind()区别
m0_71242735的博客
04-14 175
on()和bind()区别
jQuery中on与bind的区别
qiuqidehao的博客
05-05 481
转载网上on与bind的区别分析
JQuery中bind方法与on方法
qq_16731745的博客
04-17 302
在学习前端的时候，发现在用js拼接的代码点击事件无响应，后来去网上查找了一下bind和on的区别，发现面对动态产生的控件，只有 on() 能成功的绑定到动态控件中，于是修改了一下代码就可以了 $('body').on('click', '.left_table table tr', function () { var ckb = $(this).find("i...
jQuery bind方法详解与应用
在jQuery中，`bind`方法是一个非常重要的事件处理函数，它允许我们将事件处理器与DOM元素关联起来。基本用法是`.bind(eventType, function)`，其中`eventType`是需要监听的事件类型，如`'click'`、`'mouseover'`等，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值