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. 完全卸载Oracle方法、步骤

    完全卸载Oracle方法: 软件环境: 1.Windows XP + Oracle 10g 2.Oracle安装路径为:d:\Oracle 1.如果数据库配置了自动存储管理(ASM),应该先删除聚集同 ...

  2. ACM 房间安排

    房间安排 时间限制:3000 ms  |  内存限制:65535 KB 难度:2   描述 2010年上海世界博览会(Expo2010),是第41届世界博览会.于2010年5月1日至10月31日期间, ...

  3. 洛谷 P1379 八数码难题 Label:判重&&bfs

    特别声明:紫书上抄来的代码,详见P198 题目描述 在3×3的棋盘上,摆有八个棋子,每个棋子上标有1至8的某一数字.棋盘中留有一个空格,空格用0来表示.空格周围的棋子可以移到空格中.要求解的问题是:给 ...

  4. [深入浅出WP8.1(Runtime)]应用实例——移动截图

    10.2应用实例——移动截图 移动截图例子是实现一个把一张图片的某个部分截取出来的功能,并且用户可以选定截取的图片区间.那个该例子会使用ManipulationDelta事件来实现对截取区间的选择.然 ...

  5. 【BZOJ】2115: [Wc2011] Xor

    http://www.lydsy.com/JudgeOnline/problem.php?id=2115 题意:给出一个n个点m条边的无向连通边加权图,求1-n的某条路径使得异或值最大(可以重复点可以 ...

  6. 【搬运工】NOIP吧置顶贴

    目的是存置顶贴里的链接.. 原帖:http://tieba.baidu.com/p/1753284199 资源站:*C++资源:http://tieba.baidu.com/p/1239792581* ...

  7. Android -- 加载布局

    如果在Activity中用到了别的Layout ,比如对话框等,你还要使用对话框中的组件,如TextView等,必须要先加载布局,然后才能使用里面的控件, 如 : View view = View.i ...

  8. Android -- 闹钟服务的使用(单次闹钟)

    1. 效果图

  9. Emmet:HTML/CSS代码快速编写神器

    本文来源:http://www.iteye.com/news/27580    ,还可参考:http://www.w3cplus.com/tools/emmet-cheat-sheet.html Em ...

  10. ID3算法

    转自:http://blog.sina.com.cn/s/blog_6e85bf420100ohma.html 信息熵就是一组数据包含的信息,概率的度量.一组数据越有序信息熵也就越低,极端时如果一组数 ...