jQuery事件之on()方法绑定多个选择器,多个事件
这样一个需求,如果用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');
http://www.qingdou.me/1536.html
jQuery事件之on()方法绑定多个选择器,多个事件的更多相关文章
- jquery on()方法绑定多个选择器,多个事件
on(events,[selector],[data],fn) •events:一个或多个用空格分隔的事件类型和可选的命名空间,如"click"或"keydown.myP ...
- 使用jquery移除前面通过onclick绑定的元素的事件,然后重新绑定别的函数来执行onclick事件。
http://caibaojian.com/css3/experience/bugs.htm 使用jquery移除前面通过onclick绑定的元素的事件,然后重新绑定别的函数来执行onclick事件. ...
- jQuery on()方法绑定动态元素的点击事件无响应的解决办法
$('#check_all').on('click' , function(){ alert(1); }); $("#yujinlist").append(html); count ...
- jQuery on()方法绑定动态元素的点击事件
之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...
- jQuery on()方法绑定动态元素的点击事件无效
之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...
- jQuery on()方法绑定动态元素的点击事件实例代码浅析
之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...
- jQuery绑定动态元素的点击事件无效
之前就一直受这个问题的困扰,在写ajax加载数据的时候发现,后面追加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢?那么,我们通过下面的示例简单说明. 示例如下: ...
- Jquery中的bind()方法的一点问题
bind()方法绑定事件的时候,第二个参数是函数,如果代码都写在函数里面,没有任何问题.但是,直接调用外部封装的函数需要注意,出错的例子: <!doctype html> <html ...
- jQuery提供的小方法
jQuery提供的小方法: 1.选择器 + 事件 + 函数 = 复杂的交互 2.循环处理与选择器匹配的各个元素:each() $("#").each(function(){ ...
随机推荐
- 仿酷狗音乐播放器开发日志十九——CTreeNodeUI的bug修复二(附源码)
转载请说明原出处,谢谢 今天本来打算把仿酷狗播放列表的子控件拖动插入功能做一下,但是仔细使用播放列表控件时发现了几个逻辑错误,由于我的播放 列表控件是基于CTreeViewUI和CTreeNodeUI ...
- js控制不同的时间段显示不同的css样式
js控制不同的时间段显示不同的css样式 js函数,可以放到单独的js文件中也可以放到当前页的<head>标记之内 function getCSS(){ datetoday ...
- [GRYZ2015]INCR
题目描述 数列 A1,A2,...,AN,修改最少的数字,使得数列严格单调递增. 输入格式 第 1 行,1 个整数 N 第 2 行,N 个整数 A1,A2,...,AN 输出格式 1 个整数,表示最少 ...
- wuzhicms 后台登录存留时间实现方式
在五指后台管理登录后,超过半小时不操作后台(不刷新页面或切换页面),就就会强制退出后台. 实现的思路是,在每次刷新页面都把当前时间存储下来,利用php的session机制来检测比对当前时间和数据库中存 ...
- 50道经典的JAVA编程题(汇总)
这是一次不可思议的编程历程.从2013年的最后一天开始做这份题,中间连续好几天的考试,包括java考试(今天考试的JAVA编程题),直到今天完成了.挺有成就感的...废话不多说了,来电实质性的吧. 全 ...
- ubuntu下通过pip安装pyside
首先安装相关库 sudo apt-get install build-essential git cmake libqt4-dev libphonon-dev python2.7-dev libxml ...
- HDU-4747 Mex 线段树
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4747 题意:求一个数列中,所有mex(L,R)的和. 注意到mex是单调不降的,那么首先预处理出mex ...
- Context Menu on DataGrid
应该设置 fitColumns: true 合并表头显示有问题 代码见示例
- cocos2d-x生成随机数
//获取系统时间 //time_t是long类型,精确到秒,通过time()函数可以获得当前时间和1970年1月1日零点时间的差 time_t tt; ...
- Oracle 递归查询
现实中我们经常需要用到一些递归查询,下面我们来介绍下ORACLE中递归查询的使用. 首先我们先新建一个表来存储以上信息 create table FAMILY ( person_id INTEGER, ...