您现在的位置: 万盛学电脑网 >> 程序编程 >> 脚本专题 >> javascript >> 正文

jQuery中delegate与on的用法与区别

作者:佚名    责任编辑:admin    更新时间:2022-06-22

 jQuery1.7中 .delegate()已被.on()取代,下面以示例的方式为大家介绍下jQuery中delegate与on的用法与区别,感兴趣的朋友可以参考下

在jQuery1.7中 .delegate()已被.on()取代。对于早期版本,它仍然使用事件委托的最有效手段。  在事件绑定和委派,delegate()和on在一般情况下,这两种方法是等效的。    .delegate() 指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。  代码如下: // jQuery 1.4.3+  $( elements ).delegate( selector, events, data, handler );  // jQuery 1.7+  $( elements ).on( events, [selector], data, handler );    例如:.delegate() code:  代码如下: $("table").delegate("td","click",function(){  alert("hello");  });    .on() code:  代码如下: $("table").on("click", "td", function() {  alert("hi");  });    PS: 两者区别是seleter和events顺序不同  delegate和on方法被选元素的子元素必须是"合法的"子元素。比如  复制代码 代码如下: $("table").delegate("button","click",function(){...});  $("table").on("click", "p", function(){...});    就不起作用,因为正常情况下,table子元素应为tr,td...    on(events,[selector],[data],fn),参数[selector]是可选,  一个选择器字符串用于过滤器的触发事件的选择器元素的后代。  例如:  代码如下: $("table").on("click", ".td1", function() {  alert("hi");  });    过滤class为td1的table子元素    而delegate的selector是必需的。