jquery on()方法绑定多个选择器,多个事件
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()方法绑定多个选择器,多个事件的更多相关文章
- jQuery事件之on()方法绑定多个选择器,多个事件
这样一个需求,如果用live()方法实现的话 非常简单,容易理解. $('nav li, #sb-nav li, #help li').live('click', function () { // c ...
- 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 on方法绑定事件后执行多次
每次绑定前先取消上次的绑定. $('#sub').unbind('click').click(function () { ... });
- jQuery之方法绑定(事件注册)代码小结
1.最直接的模式,直接将一个function对象传入方法函数,如下面的click(),好处坏处一看便知 $("#btnComfirmChooseCompany").click(fu ...
- jQuery clone()方法绑定事件
先看如下代码: (function ($) { var div = $("<div></div>").css({width: "100px&quo ...
- jQuery绑定动态元素的点击事件无效
之前就一直受这个问题的困扰,在写ajax加载数据的时候发现,后面追加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢?那么,我们通过下面的示例简单说明. 示例如下: ...
随机推荐
- C#/.NET Little Wonders: Use Cast() and OfType() to Change Sequence Type(zz)
Once again, in this series of posts I look at the parts of the .NET Framework that may seem trivial, ...
- ccc tiledmap
//移动方向枚举类 var MoveDirection = cc.Enum({ NONE: 0, UP: 1, DOWN: 2, LEFT: 3, RIGHT: 4 }); var minTilesC ...
- BZOJ4171 : Rhl的游戏
把第一行每个位置设成未知量,对于之后每一行,都可以用第一行的未知量线性表示. 那么只需要加上最后一行的$m$个方程,对于不能按的那$k$个位置也列出对应的方程. 用高斯消元判断是否有解即可,时间复杂度 ...
- 20145308刘昊阳 《Java程序设计》第6周学习总结
20145308刘昊阳 <Java程序设计>第6周学习总结 教材学习内容总结 第10章 输入/输出 10.1 InputStream与OutputStream 10.1.1 串流设计概念 ...
- jquery.cookie.js使用
1.下载jquery.cookie.js 官网:http://plugins.jquery.com/cookie/ 或 http://pan.baidu.com/s/1mgynA8g 2.使用方法 $ ...
- bzoj 1217 [HNOI2003]消防局的设立 Label:图论
题目描述 2020年,人类在火星上建立了一个庞大的基地群,总共有n个基地.起初为了节约材料,人类只修建了n-1条道路来连接这些基地,并且每两个基地都能够通过道路到达,所以所有的基地形成了一个巨大的树状 ...
- jQueryUI日期显示
<script type="text/javascript" src="js/My97DatePicker/WdatePicker.js">< ...
- APP测试流程
1 APP测试基本流程 1.1流程图 1.2测试周期 测试周期可按项目的开发周期来确定测试时间,一般测试时间为两三周(即15个工作日),根据项目情况以及版本质量可适当缩短或延长测试时间.正式测试前先向 ...
- 《深入浅出Windows 10通用应用开发》
<深入浅出Windows 10通用应用开发>采用Windows 10的SDK进行重新改版,整合了<深入浅出Windows Phone 8.1应用开发>和<深入解析 ...
- [深入浅出WP8.1(Runtime)]生成图片和存储生成的图片文件
7.2.3 使用RenderTargetBitmap类生成图片 RenderTargetBitmap类可以将可视化对象转换为位图,也就是说它可以将任意的UIElement以位图的形式呈现.那么我们在实 ...