jQuery中bind,live,delegate,on的区别
bind(),live()都是调用on()函数,只不过传递的参数不同。
一、$(selector).bind(event,data,fn);
$('#J_btn').bind('click',function(){
//直接绑定在指定元素上
//只能针对已经存在的元素进行事件的设置
});
二、$(selector).live(event,data,fn);
$('#J_btn').live('click',function(){
//委托,绑定在父元素上,父元素只能是document
//live可以实现动态绑定
//通过冒泡的方式来绑定到元素上
//支持未来新添加元素的事件设置
});
三、$(selector).delegate(childSelector,event,data,fn);
$("#J_btn").delegate("J_btn_left","click",function(){
//委托,绑定在父元素上,父元素可以是任意的祖先节点
//delegate可以实现动态绑定
//通过冒泡的方式来绑定到元素上
//支持未来新添加元素的事件设置
});
四、$(selector).on(event,childselector,data,fn);
$("#J_btn").on("click","J_btn_left",function(){
//支持未来新添加元素的事件设置
});
jQuery推出on()的目的有2个,一是为了统一接口,二是为了提高性能,所以从现在开始用on()替换bind(), live(), delegate()吧。尤其是不要再用live()了,因为它已经处于不推荐使用列表了,随时会被干掉。如果只绑定一次事件,那接着用one()吧,这个没有变化。bind()支持Jquery所有版本;live()支持jquery1.8-;delegate()支持jquery1.4.2+;on()支持jquery1.7+。
五、事件处理
1、单事件处理
$(selector).on("click",data,fn);
2、多事件处理
A、利用空格分割多事件
$(selector).on("click dbclick mouseout",childselector,data,fn);
B、利用大括号灵活定义多事件
$(selector).on({
event1:fn,
event2:fn,
...
});
C、链式绑定事件
$(selector)
.on("click",childselector,data,fn)
.on("dbclick",childselector,data,fn)
.on("mouseout",childselector,data,fn);
unbind(),die()和undelegate()方法也合并成了off()方法。
jQuery中bind,live,delegate,on的区别的更多相关文章
- jQuery中.bind() .live() .delegate() .on()的区别 和 三种方式写光棒事件 动画
地狱的镰刀 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数. $("a").bind("click",function(){ ...
- jquery中bind,live,delegate,on的区别
这几种方法都是绑定事件用到的,但是他们之间有些差别 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 例如: <ul> <a href=" ...
- 【转】jQuery中.bind() .live() .delegate() .on()的区别
bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 $("a").bind("click",function(){alert(& ...
- jQuery中.bind() .live() .delegate() .on()的区别
bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 $("a").bind("click",function(){alert(& ...
- jQuery中bind() live() delegate() on() 的区别
实例 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 $("a").bind("click",function(){aler ...
- jQuery中bind方法和live方法区别解析
Javascript中的事件有它的独特性,有默认的执行事件,例如冒泡就是其中的一个.在很多比较复杂的应用程序中,停止事件的冒泡或捕获在程序开发当中是十分有用的,而在IE中有它的独特方式来阻止事件的冒泡 ...
- jQuery 中bind(),live(),delegate(),on() 区别(转)
当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...
- 转 jQuery 中bind(),live(),delegate(),on() 区别
当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...
- jquery实现input输入框实时输入触发事件代码 ---jQuery 中bind(),live(),delegate(),on() 区别
复制代码 代码如下: <input id="productName" name="productName" value="" /> ...
- jQuery中.bind() .live() .delegate() .on()区别
$(selector).bind(event,data,function) $(selector).live(event,data,function)//jquery1.9版本以下支持,jquery1 ...
随机推荐
- HDU 1074 Doing Homework (dp+状态压缩)
题目链接 Problem Description Ignatius has just come back school from the 30th ACM/ICPC. Now he has a lot ...
- supervisor简洁用例
supervisor是什么 superviosr是一个Linux/Unix系统上进程监控和管理的工具,它由python编写,可以用pip安装.supervisor能将一个普通的命令行进程变为后台dae ...
- CodeForces 724G: Xor-matic Number of the Graph
题目传送门:CF724G. 题意简述: 一张 \(n\) 个点的无向图,边有边权. 定义三元组 \((u,v,w)(1\le u < v\le n)\) 合法当且仅当存在从点 \(u\) 到点 ...
- HDU 6196 happy happy happy 爆搜加剪枝
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6196 题意:给你长度为n的序列,爸爸和儿子玩一个游戏,儿子先手,儿子每次都选择最左边与最右边最大的那个 ...
- mysql高可用架构 -> MHA部署-04
MHA架构图 本次MHA的部署基于GTID复制成功构建,普通主从复制也可以构建MHA架构. 下载所需的软件包 mkdir /server/tools -p //创建存放包的目录 [root@db01 ...
- 你的组织使用了 windows defender 应用程序控制来阻止此应用
=============================================== 2018/2/8_第1次修改 ccb_warlock === ...
- Django 2.0.3安装-压缩包方式
OS:Windows 10家庭中文版,CPU:Intel Core i5-8250U Python版本:Python 2.7,Python 3.6 Django版本:2.0.3(最新2.0.5) 解压 ...
- python网络编程-线程队列queue
一:线程queu作用 Python中,queue是线程间最常用的交换数据的形式. 队列两个作用:一个是解耦,一个是提高效率 二:语法 1)队列的类 class queue.Queue(maxsize= ...
- 网络协议之UDP
前言 TCP协议在不可靠的网络环境上提供了可靠的通信通道,隐藏了大量的底层细节,使应用程序更加简洁.但有些应用并不需要这么高的可靠性,并不需要按序交付,而且TCP为了提高可靠性也增加了延时,在某些对延 ...
- Ubuntu下apache2启动、停止、重启、配置
Linux系统为Ubuntu 一.Start Apache 2 Server /启动apache服务# /etc/init.d/apache2 startor$ sudo /etc/init.d/ap ...