jQuery事件委托方法 bind live delegate on
1.bind jquery 1.3之前
定义和用法:主要用于给选择到的元素上绑定特定事件类型的监听函数
语法: bind(type,[data],function(e));
特点:
a.适合页面元素静态绑定,只能调用已经存在的元素绑定事件
b.当页面加载完后,才可以进行bind(), 所以有可能产生效率问题
2.live jquery 1.7之后不能使用
定义和用法:主要用于给选择到的元素上绑定特定事件类型的监听函数;
语法:live(type, [data], fn);
特点:
(1)、live方法并没有将监听器绑定到自己(this)身上,而是绑定到了this.context上了。
(2)、live正是利用了事件委托机制来完成事件的监听处理,把节点的处理委托给了document,新添加的元素不必再绑定一次监听器。
(3)、使用live()方法但却只能放在直接选择的元素后面,不能在层级比较深,连缀的DOM遍历方法后面使用,即$(“ul”").live...可以,但$("body").find("ul").live...不行;
实例如下:$( document ).on( "click", "#members li a", function( e ) {} );
(3)、delegate 【jQuery 1.4.2中引入】
定义和用法:将监听事件绑定在就近的父级元素上
语法:delegate(selector,type,[data],fn)
特点:
(1)、选择就近的父级元素,因为事件可以更快的冒泡上去,能够在第一时间进行处理。
(2)、更精确的小范围使用事件代理,性能优于.live()。可以用在动态添加的元素上。
实例如下:
$("#info_table").delegate("td","click",function(){/*显示更多信息*/});
$("table").find("#info").delegate("td","click",function(){/*显示更多信息*/});
(4)、on 【1.7版本整合了之前的三种方式的新事件绑定机制】
定义和用法:将监听事件绑定到指定元素上。
语法:on(type,[selector],[data],fn)
实例如下:$("#info_table").on("click","td",function(){/*显示更多信息*/});参数的位置写法与delegate不一样。
说明:on方法是当前JQuery推荐使用的事件绑定方法,附加只运行一次就删除函数的方法是one()。
总结:.bind(), .live(), .delegate(),.on()分别对应的相反事件为:.unbind(),.die(), .undelegate(),.off()
jQuery事件委托方法 bind live delegate on的更多相关文章
- jQuery事件绑定方法bind、 live、delegate和on的区别
我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 1.准备知识 当我们在开始的时候,有些知识是必须具备的: 1 ...
- jquery 事件委托
什么事件委托? DOM在为页面中的每个元素分派事件时,相应的元素一般都在事件冒泡阶段处理事件.在类似 body > div > a 这样的结构中,如果单击a元素,click事件会从a一直冒 ...
- JQuery的click、bind、delegate、off、unbind
.click与.bind .click和.bind都是给每个元素绑定事件,对于只绑定一个click事件,.bind事件的简写就是.click那种方式. 这两种方式都会出现两个问题: 第一个问题,如果要 ...
- javascript事件委托和jquery事件委托
元旦过后,新年第一篇. 初衷:很多的面试都会涉及到事件委托,前前后后也看过好多博文,写的都很不错,写的各有千秋,自己思前想后,为了以后自己的查看,也同时为现在找工作的前端小伙伴提供一个看似更全方位的解 ...
- 【Unity3D技巧】在Unity中使用事件/委托机制(event/delegate)进行GameObject之间的通信 (二) : 引入中间层NotificationCenter
作者:王选易,出处:http://www.cnblogs.com/neverdie/ 欢迎转载,也请保留这段声明.如果你喜欢这篇文章,请点[推荐].谢谢! 一对多的观察者模式机制有什么缺点? 想要查看 ...
- js进阶---12-12、jquery事件委托怎么使用
js进阶---12-12.jquery事件委托怎么使用 一.总结 一句话总结:通过on方法(事件委托),给要绑定事件的元素的祖先绑定事件,从而达到效果. 1.事件委托是什么? 通过事件冒泡,让子元素绑 ...
- jQuery事件委托
jQuery事件委托 <ul id="ulBox"> <li data-id="1"></li> <li data-i ...
- jquery事件委托详解
jQuery事件委托处理流程 上一章分析jQuery.event.add的时候已经分析了事件绑定,再把绑定的部分源码抽出来 if ( !(eventHandle = elemData.handle) ...
- 转载: jQuery事件委托( bind() \ live() \ delegate()) [委托 和 绑定的故事]
转载:http://blog.csdn.net/zc2087/article/details/7287429 随着DOM结构的复杂化和Ajax等动态脚本技术的运用,事件委托自然浮出了水面.jQuery ...
随机推荐
- windows开机锁定小键盘
1.启动注册表编缉器 按下windows+R键,输入regedit回车启动注册表编缉器 2.修改注册表默认值 展开HKEY_USERS\.DEFAULT\Control Panel\Keyboard将 ...
- learning ddr mode register MR1
- flask小例
#写一个app.py,处理3个URL: ''' GET / : 首页,返回Home; GET /signin:登录页,显示登录表单; POST /signin: 处理登录表单,显示登录结果. ''' ...
- 1.1最简单的socket连接
socket 服务器代码 # -*- coding: utf-8 -*-from socket import * myHost = '' #''说明所有IP都可以连接 myPort = 50007 # ...
- JavaScript 基础,登录前端验证
<script></script>的三种用法: 放在<body>中 放在<head>中 放在外部JS文件 <!DOCTYPE html> & ...
- JavaScript+CSS+DIV实现下拉菜单示例
<!DOCTYPE html> <html> <head> <title>下拉菜单示例</title> <script languag ...
- Android开发---如何操作资源目录中的资源文件
效果图: 1.activity_main.xml <?xml version="1.0" encoding="utf-8"?> <Linear ...
- java.lang.ClassCastException: android.os.BinderProxy cannot be cast to com.test.Test
由于我在第二个Activity中指定了进程名字,但是服务却没有指定进程名(默认跟主入口一个进程)所以报错. 网上找到的是 服务 和绑定服务的客户端必须在同一个application或者进程中,所以Ma ...
- android 自定义命名空间 http://schemas.android.com/apk/res-auto
XML中用 xmlns="http://schemas.android.com/apk/res-auto" 获取自定义属性值: public static String NAMES ...
- AntPathMatcher做路径匹配
转发自: http://www.cnblogs.com/leftthen/p/5212221.html 需要看详细的请看上面的链接 这里以我这里的一个Filter 中需要对路径做例外处理,filter ...