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

•events:一个或多个用空格分隔的事件类型和可选的命名空间,如"click"或"keydown.myPlugin" 。
•selector:一个选择器字符串用于过滤器的触发事件的选择器元素的后代。如果选择器为null或省略,当它到达选定的元素,事件总是触发。
•data:当一个事件被触发时要传递event.data给事件处理函数。 
•fn:该事件被触发时执行的函数。 false 值也可以做一个函数的简写,返回false。

这样一个需求,如果用live()方法实现的话 非常简单,容易理解。

$('nav li, #sb-nav li, #help li').live('click', function () {
// code...
});

jquery在1.7版本后,建议大家用on方法代替之前的bind、live、delegate方法。
那上面一句如果用on的话,怎么写呢?

其实查看live源码就知道,live实际是委托doucment进行事件委派的。

按照这个思路,可以将on方法绑定到document即可。

$(document).on('click', '#header .fixed-feedback-bn, #sb-sec .feedback-bn', function () {
// code...
});

还有一种情况,on()方法绑定多个事件,可以这样写:

$("table.planning_grid").on({
mouseenter: function() {
// Handle mouseenter...
},
mouseleave: function() {
// Handle mouseleave...
},
click: function() {
// Handle click...
}
}, "td");

最后,用on()方法绑定多个选择器,多个事件则可以这样写:

$(document).on({
mouseenter: function() {
// Handle mouseenter...
},
mouseleave: function() {
// Handle mouseleave...
},
click: function() {
// Handle click...
}
}, '#header .fixed-feedback-bn, #sb-sec .feedback-bn');

jquery on()方法绑定多个选择器,多个事件的更多相关文章

  1. jQuery事件之on()方法绑定多个选择器,多个事件

    这样一个需求,如果用live()方法实现的话 非常简单,容易理解. $('nav li, #sb-nav li, #help li').live('click', function () { // c ...

  2. jQuery on()方法绑定动态元素的点击事件无响应的解决办法

    $('#check_all').on('click' , function(){ alert(1); }); $("#yujinlist").append(html); count ...

  3. jQuery on()方法绑定动态元素的点击事件

    之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...

  4. jQuery on()方法绑定动态元素的点击事件无效

    之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...

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

    之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...

  6. Jquery on方法绑定事件后执行多次

    每次绑定前先取消上次的绑定. $('#sub').unbind('click').click(function () { ... });

  7. jQuery之方法绑定(事件注册)代码小结

    1.最直接的模式,直接将一个function对象传入方法函数,如下面的click(),好处坏处一看便知 $("#btnComfirmChooseCompany").click(fu ...

  8. jQuery clone()方法绑定事件

    先看如下代码: (function ($) { var div = $("<div></div>").css({width: "100px&quo ...

  9. jQuery绑定动态元素的点击事件无效

    之前就一直受这个问题的困扰,在写ajax加载数据的时候发现,后面追加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢?那么,我们通过下面的示例简单说明. 示例如下: ...

随机推荐

  1. HDU 2836 (离散化DP+区间优化)

    Reference:http://www.cnblogs.com/wuyiqi/archive/2012/03/28/2420916.html 题目链接: http://acm.hdu.edu.cn/ ...

  2. cdoj 1328 卿学姐与诡异村庄 Label:并查集 || 二分图染色

    卿学姐与诡异村庄 Time Limit: 4500/1500MS (Java/Others)     Memory Limit: 65535/65535KB (Java/Others) Submit  ...

  3. js判断访问来源

    通过navigator的userAgent属性来判定 userAgent 属性是一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值.一般来讲,它是在 navigator.appCode ...

  4. Makefile学习

    makefile中常用的函数: http://linux.chinaunix.net/techdoc/develop/2009/07/09/1122854.shtml SRC = $(wildcard ...

  5. __attribute__ 变量对齐

    http://blog.163.com/sunm_lin/blog/static/9192142200741533038695/ 一.   __attribute__ ((aligned (n))) ...

  6. 高性能分布式内存队列系统beanstalkd(转)

    beanstalkd一个高性能.轻量级的分布式内存队列系统,最初设计的目的是想通过后台异步执行耗时的任务来降低高容量Web应用系统的页面访问延迟,支持过有9.5 million用户的Facebook ...

  7. GO语言练习:第二个工程--模拟音乐播放器

    1.代码 2.编译及运行 1.目录结构 1.1) $ tree . ├── mplayer.go └── src ├── mlib │   ├── manager.go │   └── manager ...

  8. Oracle 字符串函数

    平常我们用Oracle主要有两种字符串类型1.char始终为固定的长度,如果设置了长度小于char列的值,则Oracle会自动用空格填充的.当比较char时,Oracle用空格将其填充为等长,再进行比 ...

  9. 对GitHub的认识

    Github创建于2008年被市场研究公司Forrester称作开发者的Facebook .作为开源代码库以及版本控制系统,Github拥有140多万开发者用户.随着越来越多的应用程序转移到了云上,G ...

  10. Linux任务调度命令(轻松管理Linux)

    Linux任务调度其实就是让系统在某个时间执行某些命令或者程序,这样可以让管理员更加轻松地管理自己的Linux,当我刚了解到这个方法时,我的内心充满了无尽的欣喜,感觉Linux实在是太强大了. 下面我 ...