0%

jQuery的.on()方法详解

我一般用w3school来查jquery的API,发现竟然没有on()方法。。。

遇到的问题是ajax生成的代码无法触发其中元素的JS事件,当然你可以用live()方法来实现,但是live()方法在jquery1.9版本里被删除了,这里最好是用on()方法,jquery1.7之后的版本才有on()方法。

jquery官方文档的API:

1.概述:

绑定一个或多个事件的event handler function到选中的元素上。

2.参数:

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

  • event:一个或多个空格分隔的事件类型和可选的命名空间,如“click”或“keydown.myPlugin”。
  • selector:过滤那些触发事件的被选中元素的后代元素(selector匹配的后代元素才能触发)。如果选择器是null或者被省略,则选中元素总能触发事件。
  • data:当事件被触发时,data通过event.data传递给事件处理函数。
  • handler(eventObject):事件被触发时用来处理的函数。如果一个函数只是简单地返回false,则可以使用值false(The value false is also allowed as a shorthand for a function that simply does return false.),(就是说handler这个参数可以使用false来代替一个只返回false值的函数,对吧)

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

  • events-map:{}名值对;名是一个或多个空格分隔的事件类型和可选的命名空间,值为事件被触发时用来处理的函数。
  • selector:同上。
  • data:同上。

3.demo:


$( "#dataTable tbody tr" ).on( "click", function() {
  alert( $( this ).text() );
});

也可以写成

$( "#dataTable tbody" ).on( "click", "tr", function() {
  alert( $( this ).text() );
});

参考:
http://api.jquery.com/on/
http://widdy.iteye.com/blog/1577022