jQuery事件绑定函数:on()与bind()的差别
jQuery从1.7+版本开始,提供了on()和off()进行事件处理函数的绑定和取消。on()和bind()这两个方法有相同的地方也有不同的地方.
bind(type,[data],fn); on(type,[selector],[data],fn);
两者的区别就在于是否支持selector这个参数值。如果使用on的时候,不设置selector,那么on与bind就没有区别了。
e<div id="parent">
<input type = "button" value="a" id=“a”>
<input type = "button" value="b" id=“b”>
</div>
上面的代码中,如果我们使用bind()在parent上绑定了click事件处理函数,当点击a或者b按钮的时候,都会执行事件处理函数。如果我们希望点击a的时候触发,点击b的时候不触发,那么可以使用on,代码如下:
$("#parent").on("click","#a",function(){
alert($(this).attr("id"));
})
bind方法无法实现该功能。
还有一点需要注意:on绑定的事件处理函数,对于未来新增的元素一样可以的,和delegate效果相同,而bind则不行。
delegate用法与on()相同,只是参数的顺序不同:
delegate([selector],type,[data],fn);
还有一个live()方法,在jQuery1.9中被移除了,完全可以使用on()来替代它得作用,不建议使用此方法。
jQuery事件绑定函数:on()与bind()的差别的更多相关文章
- js事件委托和jQuery事件绑定on , off , one , bind , unbind , die
一. 事件委托什么是事件委托?用现实中的理解就是:有100 个学生同时在某天中午收到快递,但这100 个学生不可能同时站在学校门口等,那么都会委托门卫去收取,然后再逐个交给学生.而在jQuery 中, ...
- jquery事件绑定函数
1.bind 使用语法: jQueryObject.bind( events [, data ], handler ) jQueryObject.bind( events [, data ] [, i ...
- jQuery事件绑定on()、bind()与delegate() 方法详解
jquery中有四种事件绑定函数,bind(),live(),on(),delegate(),由于live现在并不常用,因此不做过多解释. 1. bind()用法 $("div p" ...
- jQuery事件绑定方法bind、 live、delegate和on的区别
我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 1.准备知识 当我们在开始的时候,有些知识是必须具备的: 1 ...
- JS+Zero Clipboard swf复制到剪贴板 兼容浏览器(bind事件绑定函数)
转自http://www.ipmtea.net/css_ie_firefox/201107/07_499.html 1.ZeroClipboard其实是国外的一个js类库,源码结构如: var Zer ...
- JQuery事件绑定,bind与on区别
jquery事件绑定bind:向匹配元素添加一个或多个事件处理器 $(selector).bind("click",data,function); live:向当前或未来的匹配元素 ...
- 深入学习jQuery事件绑定
× 目录 [1]bind [2]trigger [3]delegate[4]on[5]one 前面的话 javascript有HTML.DOM0级.DOM2级和IE这四种事件处理程序,而jQuery对 ...
- jQuery 事件绑定 和 JavaScript 原生事件绑定
总结一下:jQuery 事件绑定 和 JavaScript 原生事件绑定 及 区别 jQuery 事件绑定 jQuery 中提供了四种事件监听绑定方式,分别是 bind.live.delegate.o ...
- javascript事件委托和jQuery事件绑定on、off 和one以及on绑定多个事件(重要)
一. 事件委托什么是事件委托?用现实中的理解就是:有100 个学生同时在某天中午收到快递,但这100 个学生不可能同时站在学校门口等,那么都会委托门卫去收取,然后再逐个交给学生.而在jQuery 中, ...
随机推荐
- JVM原理解析
JVM主要的功能: 内存分配 程序调度 内存释放(栈等自动释放.堆垃圾回收) 异常处理 https://www.cnblogs.com/dingyingsi/p/3760447.html https: ...
- shell script-条件语句、循环语句
条件语句 #!/bin/bash read -p "input your name:" name #第一种判断 if [ "$name" == "Mi ...
- 18. CTF综合靶机渗透(十一)
靶机描述: SkyDog Con CTF 2016 - Catch Me If You Can 难度:初学者/中级 说明:CTF是虚拟机,在虚拟箱中工作效果最好.下载OVA文件打开虚拟框,然后选择文件 ...
- 20169201 2016-2017-2 实验二《Java面向对象程序设计》
实验一:程序设计中临时变量的使用 代码托管 1.删除数组中的元素5 for(int i = 4; i < arr.length - 1; i ++){ arr[i] = arr[i + 1]; ...
- 将前台传回的HttpServletRequest转换成HashMap
import java.util.HashMap;import java.util.Map;import java.util.Map.Entry;import java.util.Set; impor ...
- ASP.NET MVC 小牛之旅3:Routing——网址路由
网址路由(Routing)在ASP.NET MVC中有两个主要用途,一个用途是匹配通过浏览器传来的HTTP请求,另一个用途则是响应适当的网址给浏览器. 3.1匹配通过浏览器传来的HTTP请求 首先我们 ...
- OpenStack基础知识-单元测试工具介绍
针对以前学的内容的一个简单整理 1.单元测试工具介绍 unittest: 是 Python 的标准库,提供了最基本的单元测试功能,包括 单元测试运行器(简称runner) 和 单元测试框架.项目的单元 ...
- 51nod1043(数位dp)
题目链接:https://www.51nod.com/onlineJudge/questionCode.html#!problemId=1043 题意:中文题诶- 思路:数位dp 我们用dp[i][j ...
- springmvc json 简单例子
1.控制器层: @RequestMapping("/json.do") @ResponseBody //将会把返回值 转换为json对象 public List<User&g ...
- PAT甲级——1101 Quick Sort (快速排序)
本文同步发布在CSDN:https://blog.csdn.net/weixin_44385565/article/details/90613846 1101 Quick Sort (25 分) ...