`

jquery的bind和on绑定事件的区别

阅读更多

bind和on的绑定事件的区别:

jquery文档中bind和on函数绑定事件的用法:

.bind(events [,eventData], handler)

.on(events [,selector]  [,data], handler)

 

$('ul li').bind('click', function(){console.log('click');})绑定的事件,动态添加的li元素不会被绑定click事件,同样的已有的li被删除,但是click事件仍然在

用$('ul').on('click', 'li', function(){console.log('click');}方式绑定,动态添加的li的事件是可以被监听到的

 

on方法用的是事件代理(委托)机制,结合dom元素的捕获特性和JavaScript事件冒泡的高级特性,把事件绑定在父元素上 ;这种情况一般用在子元素较多或者子元素是变化的场景中;但是如果只是把事件绑定在父元素上,就需要在事件触发时判断当前触发的子元素,所以on方法的第二个可选参数selector就有用了

 

.on的selector参数指定是父元素代理的子元素

分享到:
评论

相关推荐

    jquery绑定事件 bind和on的用法与区别分析

    本文实例讲述了jquery绑定事件 bind和on的用法与区别。分享给大家供大家参考,具体如下: bind和on都是给元素绑定事件用的,其最大的区别就是事件冒泡 事件冒泡也是委托事件的原型,事件委托就是子类的事情委托给父类...

    jQuery中的on与bind绑定事件区别实例详解

    events:一个或多个用空格分隔的事件类型和可选的命名空间,如”click”或”keydown.myPlugin” 。 selector:一个选择器字符串用于过滤器的触发事件的选择器元素的后代. data:当一个事件被触发时要传递event.data...

    jQuery使用bind函数实现绑定多个事件的方法

    本文实例讲述了jQuery使用bind函数实现绑定多个事件的方法。分享给大家供大家参考,具体如下: 在jQuery中绑定多个事件名称是,使用空格隔开,举例如下: $("#foo").bind("mouseenter mouseleave", function() { $...

    【JavaScript源代码】JQuery绑定事件四种实现方法解析.docx

     jQuery中提供了四种事件监听方式,分别是bind、live、delegate、on,对应的解除监听的函数分别是unbind、die、undelegate、off。在开始看他们之前 一:bind(type,[data],function(eventObject)) bind是使用频率...

    jQuery中绑定事件bind() on() live() one()的异同

    本文主要介绍了jQuery中绑定事件bind() on() live() one()的异同,具有很好的参考价值,下面跟着小编一起来看下吧

    jQuery给动态添加的元素绑定事件的方法

    jquery中绑定事件一般使用bind,或者click,但是这只能是对已经加载好的元素定义事件,那些后来添加插入的元素则需要另行绑定。在1.7版本以前使用live。但是在1.8版本以后推荐使用on。这里介绍jQuery中如何给动态...

    Jquery绑定事件(bind和live的区别介绍)

    其实就和普通JS的用法差不多,只是少了一个on而已 第二、三种方法都是绑定事件,但是二者又有很大的不同,下面着重讲解一下,因为这个如果用到Jquery的框架的话是用的挺多的,尤其要注意二者的区别。 【bind和live的...

    jQuery中的bind绑定事件与文本框改变事件的临时解决方法

    然后onclick之类的都试了,没一个能用的,无奈去翻jQuery的API,都是鸟语我也看不懂具体说了点了,但是发现bind注册事件都是没有on的。 发现有change事件,试了试 代码如下: $(“#txtStation”).change(function(){...

    jQuery绑定事件方法及区别(bind,click,on,live,one)

    主要介绍了jq绑定事件方法及区别,通过五种绑定方式使用bind()进行操作,并和one()进行区分,需要的朋友可以参考下

    jQuery的三种bind/One/Live/On事件绑定使用方法

    今天浏览jQuery的deprecated列表,发现live()和die()在里面了,赶紧看了一下,发现从jQuery1.7开始,jQuery引入了全新的事件绑定机制,on()和off()两个函数统一处理事件绑定。因为在此之前有bind(), live(), ...

    jQuery中对未来的元素绑定事件用bind、live or on

    主要介绍了jQuery中对未来的元素绑定事件用bind、live or on,需要的朋友可以参考下

    jQuery绑定事件的四种方式介绍

    jQuery中提供了四种事件监听方式,分别是bind、live、delegate、on,对应的解除监听的函数分别是unbind、die、undelegate、off。在开始看他们之前 一:bind(type,[data],function(eventObject)) bind是使用频率较高...

    关于jquery input textare 事件绑定及用法学习

    (1)jquery 绑定事件 目前1.7以上,jquery的事件绑定已经用on替换了原来的bind; 区别:(个人理解)bind是一次绑定事件到每一个子节点;on是只绑定到父节点,然后冒泡到各个子节点; 用法:bind 一个事件,一个方法:$...

    jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解

    因为项目中经常会有利用jquery操作dom元素的增删操作,所以会涉及到dom元素的绑定事件方式,简单的归纳一下bind,live,delegate,on的区别,以便以后查阅,也希望该文章日后能帮助到各位朋友,文中如有不当之处,还望...

    关于Jquery中的bind(),on()绑定事件方式总结

    一.bind() 使用方式:$(selector).bind(event,data,function) event:必需项;添加到元素的一个或多个事件,例如 ...2.利用大括号灵活定义多事件,例如 $(selector).bind({event1:function, event2:function, …}) 

    JQuery绑定事件四种实现方法解析

    jQuery中提供了四种事件监听方式,分别是bind、live、delegate、on,对应的解除监听的函数分别是unbind、die、undelegate、off。在开始看他们之前 一:bind(type,[data],function(eventObject)) bind是使用频率较高...

    jQuery on()方法绑定动态元素的点击事件实例代码浅析

    jQuery 使用on绑定动态生成的元素时,不能直接用该对象操作,而是选择其非动态生成的父节点然后再找到本身才能达到效果。大家看看源码就知道了。生成的按钮基数项on方法点击无效live方法有效。 比如页面上有下边两个...

Global site tag (gtag.js) - Google Analytics