在项目开发中,经常遇到绑定事件不起作用,或者事件绑定多次,导致重复触发。...将事件绑定在document上,所有事件触发冒泡到根节点document的时候,判断是否为click事件、并且是否为selector元素都符合则执行事件函数 delegate方法 原理上delegate...方法和live方法很类似,都是传递选择器和执行函数两个参数到document上判断, $(document).delegate("selector","click",function(){...}) ...[注意:live事件,jQuery 1.7以后版本使用on代替live,且移动设备safari浏览器不支持live事件] 【穿插解决方案: 移动设备safari浏览器不支持live事件 方法一: 首先要给绑定...函数 可能有时候的需求需要触发某个特定事件,这时我们会想当然使用trigger触发事件,但是却没有考虑到带来的隐患。
jQuery的.on()、.bind()、.live()和.delegate()之间的区别并非总是那么明显的,然而,如果我们对所有的不同之处都有清晰的理解的话,那么这将会有助于我们编写出更加简洁的代码,...现在我们可以较容易地说明.on()、.bind()、.live()和.delegate()的不同之处了。.../jquery1.9版本以下支持,jquery1.9及其以上版本删除了此方法,jquery1.9以上版本用on()方法来代替 $(selector).delegate(childSelector...,但是根据官网解释,自从jquery1.7版本以后bind()函数推荐用on()来代替。...而不是document上,像这样: $('a', $('#container')).live(...); 3 .delegate() .delegate()则是更精确的小范围使用事件代理,性能优于
绑定click事件,使用jquery的$().click(func)?别闹了,属实是low。 虽然之前在ajax回调成功后通过dom添加过元素,遇到过这种情况,事件绑定会失效。...$().on()的知识点补充: 1.从jQuery 1.7开始,on()函数提供了绑定事件处理程序所需的所有功能,用于统一取代以前的bind()、 delegate()、 live()等事件函数。...$().live()是通过冒泡的方式来绑定到元素上的。更适合列表类型的,绑定到document DOM节点上。 $().delegate()是更精确的小范围的使用事件代理。...2.该函数可以为同一元素、同一事件类型绑定多个事件处理函数。触发事件时,jQuery会按照绑定的先后顺序依次执行绑定的事件处理函数。 3....{ $(this).css("background-color","pink"); }); 以上三种方法在jQuery1.8之后都不推荐使用,官方在1.9时已经取消使用live()方法了,所以建议都使用
习惯了bind,用惯了live,就不习惯delegate了呀有木有......支持为动态生成的标签元素绑定事件也许就live和delegate了吧,不过新版本已经不支持live了,只有delegate delegate真的比较特殊呀,不同于其他事件绑定的风格。...delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。...规定传递到函数的额外数据。 function 必需。规定当事件发生时运行的函数。
其中,live() 和die()、delegate()和undelegate() 是成对出现的,分别是绑定和解绑的过程。...delegate(selector,[type],[data],fn) jquery 的delegate 方法是典型的为事件委托准备的。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。...备注: 自jQuery1.9后 就废除这个函数,只能在jQuery1.9以前的版本中使用。...,只能在jQuery1.9以前的版本中使用。
使用框架的过程就是先查文档,再照着文档写代码,出错了再查文档。 2.jquery 能做什么?...实现一个目的需要很多步骤,使用原生js,就需要每个步骤都写出来,jQuery就把这些步骤打包封装进一个函数中,做成一个API,用户调用这个API,提供参数,就能一步实现目的,简洁高效。...jQuery对象:将DOM原生对象进行封装后得到的类数组对象,它是jQuery独有的。如果一个对象是jQuery对象,那么就可以使用jQuery里的方法。...同样,DOM对象也不能使用jQuery方法。 jquery提供了两种方法将一个jquery对象转换成一个dom对象,[index]和get(index)。...自 jQuery 版本 1.7 起,on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。该方法给 API 带来很多便利,简化了 jQuery 代码库。
使用 .bind() 时,选择器匹配的元素会附加一个事件处理函数,而以后再添加的元素则不会有。为此需要再使用一次 .bind() 才行。 参数: type:一个或多个事件类型,由空格分隔多个事件。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)在选择元素上绑定一个或多个事件的事件处理函数。...// live : 对 动态创建的dom元素绑定事件。 // delegate : 事件委托绑定事件。...方法是 bind()、live() 和 delegate() 方法的新的替代品。...要删除非委托元素上的所有事件,使用特殊值 "**" 。 处理程序也可以删除handler参数指定名称的函数。
第二,只触发jQuery对象集合中第一个元素的事件处理函数。 第三,这个方法的返回的是事件处理函数的返回值,而不是据有可链性的jQuery对象。...使用 .bind() 时,选择器匹配的元素会附加一个事件处理函数,而以后再添加的元素则不会有。为此需要再使用一次 .bind() 才行。 参数: type:一个或多个事件类型,由空格分隔多个事件。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)在选择元素上绑定一个或多个事件的事件处理函数。...参数说明: 如果不带参数,则所有绑定的live事件都会被移除。 如果提供了type参数,那么会移除对应的live事件。 如果也指定了第二个参数function,则只移出指定的事件处理函数。...要删除非委托元素上的所有事件,使用特殊值 "**" 。 处理程序也可以删除handler参数指定名称的函数。
唯一的区别在于,.delegate()是当事件冒泡到指定的父元素时触发,.live()则是当事件冒泡到文档的根元素后触 发,因此.delegate()比.live()稍快一点。...在委托处理的情况下,.delegate()又比.live()大约快26%。 8....因为elem.data()方法是定义在jQuery函数的prototype对象上面的, 而$.data()方法是定义jQuery函数上面的,调用的时候不从复杂的jQuery对象上调用,所以速度快得多。...所以,尽量少生成jQuery对象。 举例来说,许多jQuery方法都有两个版本,一个是供jQuery对象使用的版本,另一个是供jQuery函数使用的版本。...你既可以使用针对jquery对象的版本: var $text = $("#text"); var$ts = $text.text(); 也可以使用针对jQuery函数的版本: var
Jquery中.bind()、.live()、.delegate()和.on()之间的区别详解 使用.bind()方法非常浪费性能因为它把同一个事件处理函数附加到了每一个匹配的元素上 你应该停止使用.live....bind() , .live()和.delegate()实现的语法糖,具体取决于你如何调用它 新的方向是使用新的.on()方法。...在Jquery 1.7版本中.bind(), .live()和.delegate()方法只需要使用.on()方法一种方式来调用它们。.../* Jquery的 .bind() , .live() 和 .delegate() 方法只需要使用`.on()`方法一种方式来调用它们 */ // Bind $( "#members li a" )...+方法名 $.fn.extend(obj);对prototype进行扩展,为jquery类添加成员函数,jquery类的实例可以使用这个成员函数。
唯一的区别在于,.delegate()是当事件冒泡到指定的父元素时触发,.live()则是当事件冒泡到文档的根元素后触发,因此.delegate()比.live()稍快一点。...在委托处理的情况下,.delegate()又比.live()大约快26%。 8....因为elem.data()方法是定义在jQuery函数的prototype对象上面的,而$.data()方法是定义jQuery函数上面的,调用的时候不从复杂的jQuery对象上调用,所以速度快得多。...所以,尽量少生成jQuery对象。 举例来说,许多jQuery方法都有两个版本,一个是供jQuery对象使用的版本,另一个是供jQuery函数使用的版本。...你既可以使用针对jQuery对象的版本: var $text = $("#text"); var $ts = $text.text(); 也可以使用针对jQuery函数的版本: var $text =
总结一下:jQuery 事件绑定 和 JavaScript 原生事件绑定 及 区别 jQuery 事件绑定 jQuery 中提供了四种事件监听绑定方式,分别是 bind、live、delegate、on...live、delegate 不多用,在Jquery1.7中已经移除,这里不多说 重点介绍 bind、on bind(event,[data],function) bind 是使用频率较高的一种,作用就是在选择到的元素上绑定特定事件类型的监听函数...可选 function:监听函数,可传入event对象,这里的event是 jQuery 封装的 event 对象,与原生的event对象有区别,使用时需要注意 使用:$("#div li").bind...最常用的一种 自 jQuery 版本 1.7 起,on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。...可以发现: 使用 jQuery 的事件绑定方法,对同一个元素的 click 事件先后绑定了三个处理函数,结果按顺序都输出了,说明了 jQuery 的事件处理函数是叠加的; 而使用 JavaScript
jQuery on()方法是官方推荐的绑定事件的一个方法。..."); }); $("#div2").delegate("p","click",function(){ $(this).css("background-color","pink");... $("#div2").live("click",function(){ $(this).css("background-color","pink"); }); 以上三种方法在jQuery1.8...之后都不推荐使用,官方在1.9时已经取消使用live()方法了,所以建议都使用on()方法。...tip:如果你需要移除on()所绑定的方法,可以使用off()方法处理。
jQuery有一个很好用的delegate(事件委派)功能,可以给当前以及将来(动态添加)的元素绑定一个事件处理函数。...doctype html> delegate测试 jQuery/jquery-1.6.js"> *{padding:0;margin...).val().toUpperCase()).select(); }); }) 但是实际测下来,.select()死活就是不起作用,无奈请出setTimeout $().ready...(function(){ $("#ulTarget").delegate(":text","focus",function(){ var jqObj = $(this);
以下内容来自于《众妙之门:JavaScript 与 jQuery 技术精粹》一书,为本人在阅读的时候感觉有必要记录的地方记录而来。...){} /* cached outside loop using while */ var len = myArray.length; while (len--){} 命名空间模式 问题:程序中使用的命名空间是正确的...new Array() == false > true //空数组 == false JavaScript 七宗罪 根源:特定于浏览器的代码 与其他脚本兼容不好 相信取代测试(默认所有东西都是正确的) 使用错误的技术进行设计...click()、bind()、live()、delegate() bind()可以一次绑定多个事件,并可以传递回调函数。...()类似bind(),区别在于可将事件绑定到当前和将来的元素(通过DOM 脚本生成的元素) delegate() 在jQuery 1.4.2 中出现的未来弥补live()无法直接用于链式结构。
("(" + txt + ")"); JSON.stringify:序列化成字符串 JSON.parse:反序列化成对象 2.jQuery 元素选择器 jQuery 使用 CSS 选择器来选取 HTML...jquery----->dom: $("li") 属性选择器 jQuery 使用 XPath 表达式来选择带有给定属性的元素。...类:this.变量 (内部定义成员变量) 【js中的两种集成方式】 对象冒充:apply和call(把非对象方法的函数当做成员用,apply使用参数数组),可以实现多继承 原型链继承:类型原型...公有函数:prototype中添加 匿名函数:回调方式调用 数组:array对象 事件:bind\delegate\live\on---...-unbind\undelegate\die\off bind添加数据到document;delegate效率最高存数据,执行需要查询;on最原始的绑定;live老版本
delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。...在做项目中有很多由ajax动态生成的html标签,jquery对这些标签不会响应(selector).click(function.....查看资料有的推荐使用live方法,但live在jQuery1.7中就不再建议使用,在1.9中就给删除了,改用on方法取代live方法。...jQuery官方网站声称下面三行代码是等价的 (“.btn”).live(“click”, function(){ alert(“Goodbye!”)...; }); // jQuery 1.3+ (“.jk_table”).delegate(“.btn”, “click”, function(){ alert(“Goodbye!”)
live()函数用于为指定元素的一个或多个事件绑定事件处理函数。...即使是执行live()函数之后新添加的元素,只要它匹配当前jQuery对象的选择器,绑定的事件处理函数仍然对其有效。 要删除通过live()绑定的事件,请使用die()函数。...jQuery 1.3 新增该函数,从jQuery 1.7开始被标记为已过时,在jQuery 1.9中被移除,请使用on()函数来替代。请使用on()函数来替代。 5,die 同上。...要删除通过delegate()绑定的事件,请使用undelegate()函数。...从jQuery 1.7开始,on()函数提供了绑定事件处理程序所需的所有功能,用于统一取代以前的bind()、 delegate()、 live()等事件函数。
大家好,又见面了,我是全栈君 最近的一项研究jQuery。利用获得的最新版本1.11.1。 据该书打下面的代码示例,,反正也发现跑不起来。...('click', function() { $(this).clone().appendTo('.container'); }); }); 原来live已经废弃掉了,取而代之的是on,jQuery...并打算用on来代替bind,live,delegate。...參考API文档,on的使用方法例如以下 .on( events [, selector ] [, data ], handler(eventObject) ) 为元素绑定事件 $( "#dataTable...等价于 $( "#dataTable tbody" ).on( "click", "tr", function() { alert( $( this ).text() ); }); 为事件处理函数传递数据
前言 jquery 有四种绑定事件的方式:on, bind, delegate,live。其中 live() 方法已被移除。...自 jQuery 版本 1.7 起,on() 方法是 bind()、live() 和 delegate() 方法的新的替代。...规定只能添加到指定的子元素上的事件处理程序(且不是选择器本身,比如已废弃的 delegate() 方法)。 data 可选。事件额外的参数。使用函数的event.data获取 function 可选。...该方法给 API 带来很多便利,我们推荐使用该方法,它简化了 jQuery 代码库。...规定传递到函数的额外数据。 function 必需。规定当事件发生时运行的函数。 map 规定事件映射 ({event:function, event:function, ...})