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 ...
随机推荐
- adb(Android Debug Bridge)安装使用教程
一.说明 adb的db是debug bridge而不是和gdb一样指debug,这意思是说adb不能像gdb那样能一步步调试代码,但可以启到一些类似调试的功能. 下面就针对这些功能进行介绍,本文根据官 ...
- 使用Intellij中的Spring Initializr来快速构建Spring Boot/Cloud工程(十五)
在之前的所有Spring Boot和Spring Cloud相关博文中,都会涉及Spring Boot工程的创建.而创建的方式多种多样,我们可以通过Maven来手工构建或是通过脚手架等方式快速搭建,也 ...
- python 关闭垃圾回收
import gc gc.disable() http://blog.csdn.net/aixiaohei/article/details/6446869
- MAVEN 创建项目
使用archetype生成项目骨架 MAVEN 创建项目JAR 和 MAVEN创建项目WAR中是使用特定的acrchetype来进行创建项目,如果使用其他的archetype来创建项目或是使用 mvn ...
- Android Studio2.1版本后使用虚拟机碰见的问题总结以及其他问题
一.androidstudio的sdk配置问题 如果点击Start a new Android Studio project是没有反应的,并且在Configure下面的SDK Manager是灰色的, ...
- Python3 线程/进程池 concurrent.futures
python3之concurrent.futures一个多线程多进程的直接对接模块,python3.2有线程池了 Python标准库为我们提供了threading和multiprocessing模块编 ...
- python中字典常用的方法
#定义一个空字典: a={ } 定义一个字典: d={'age':18} #增加一个元素: d['age']=20 d[k]=v d.setdefault('age',18) d.setde ...
- C++11智能指针 share_ptr,unique_ptr,weak_ptr用法
0x01 智能指针简介 所谓智能指针(smart pointer)就是智能/自动化的管理指针所指向的动态资源的释放.它是存储指向动态分配(堆)对象指针的类,用于生存期控制,能够确保自动正确的销毁动 ...
- html随笔CSS(*^__^*)
控制文本显示字数,超过规定的文本长度 x显示... white-space:nowrap; //规定不能换行 overflow:hidden; text-overflow:ellips ...
- easyui再学习的一部分代码
<%-- Created by IntelliJ IDEA. User: zhen Date: // Time: : To change this template use File | Set ...