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 中, ...
随机推荐
- Dockerfile设置apt-get install tzdata的noninteractive方法
在Ubuntu系统中,执行命令apt-get install -y tzdata以安装tzdata软件包.但是,最近发现,在Ubuntu 18.04 (Bionic Beaver)上无法自动安装该软件 ...
- Entity Framework Code-First(10.2):Entity Mappings
Entity Mappings using Fluent API: Here, we will learn how to configure an entity using Fluent API. W ...
- NIO和Reactor
本文参考Doug Lea的Scalable IO in Java. 网络服务 随着网络服务的越来越多,我们对网络服务的性能有了更高的要求,提供一个高性能,稳定的web服务是一件很麻烦的事情,所以有了n ...
- Linux下查看文件编码,文件编码格式转换和文件名编码转换
linux相关 2008-10-07 10:46 阅读1392 评论0 字号: 大大 中中 小小 如果你需要在Linux中 操作windows下的文件,那么你可能会经常遇到文件编 ...
- Linux——DNS
正向解析和逆向解析 正向域名解析,即DNS解析,是通过域名查询IP的解析方式. 逆向域名解析,即反向DNS解析,是通过IP地址查询域名. [root@localhost ~]# cp /var ...
- Lxc容器基本用法
你将学到什么 如何安装LXC 如何创建LXC容器 如何管理LXC容器 如何查询进程所属Namespace 如何给LXC容器添加网卡 如何限制LXC容器资源 环境 x64 Ubuntu 14.04.3 ...
- remap——ROS中修改订阅的节点名称
跑数据集或者使用不同传感器时,难免会遇到需要修改topic名称的时候,此时可以有两种做法. 一.直接修改源码.如果有launch文件,则修改launch文件对应的topic 二.直接进行remap操作 ...
- Codeforces Round #523 (Div. 2)C(DP,数学)
#include<bits/stdc++.h>using namespace std;long long a[100007];long long dp[1000007];const int ...
- WPF动画——故事板(Storyboard)
1.XAML代码 <Window x:Class="故事板.MainWindow" x:Name="window" xmlns="http:// ...
- 洛谷P1310 表达式的值
P1310 表达式的值 题目描述 对于1 位二进制变量定义两种运算: 运算的优先级是: 先计算括号内的,再计算括号外的. “× ”运算优先于“⊕”运算,即计算表达式时,先计算× 运算,再计算⊕运算.例 ...