这几种方法都是绑定事件用到的,但是他们之间有些差别

bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数

例如:

    <ul>
<a href="#"><li>1111111</li></a>
<a href="#"><li>22222</li></a>
<a href="#"><li>33333</li></a>
<a href="#"><li>44444</li></a>
<a href="#"><li>555555</li></a>
</ul>
<script>
$("a").bind("click",function(){
alert("ok")
});
</script>

例如当我们用bind为a元素绑定事件时,有多少a元素,就是绑定多少次事件 ,这样比较消费性能

这种绑定方式有以下缺点:

1)它会绑定事件到所有选出来的元素上 ,例如上面的a元素

2)当页面加载完成是,才可以进行bind(),所以效率较低

3) 不可以为动态创建的html元素绑定事件,即动态创建的html用bind绑定是无效的

live(type,[data],fn) 给所有匹配的元素附加一个事件处理函数,即使这个元素是以后再添加进来的

以上面的例子为例:

 $("a").live("click",function(){
alert("ok")
});

live是通过冒泡的返航时来绑定事件的,更适合列表页,也可以绑定动态的html,但是目前最新版本的jquery已经不支持live事件绑定了

delegate(selector,[type],[data],fn) 指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数

    <ul>
<a href="#"><li>1111111</li></a>
<a href="#"><li>22222</li></a>
<a href="#"><li>33333</li></a>
<a href="#"><li>44444</li></a>
<a href="#"><li>555555</li></a>
</ul>
<input type="button" id="btnAdd" value="添加新的元素" />

点击添加新元素按钮,添加一个li元素,并为新添加的li元素绑定事件,代码如下:

$("#btnAdd").on("click",function(){
$("ul").append("<a id='ltLast' href='#''><li>我是后添加的了哦</li></a>"); }); //动态创建的html绑定事件需要用到delegate方法
$("ul").delegate("#ltLast","click",function(){
alert("可以点击我么");
});

.delegate()主要是通过事件代理的方式,一般动态创建的html绑定事件会用到这种方式

on(events,[selector],[data],fn) 在选择元素上绑定一个或多个事件的事件处理函数

.on()则是最新的1.9版本整合了之前的三种方式的新事件绑定机制,但是不能为动态的html绑定事件;

jquery中bind,live,delegate,on的区别的更多相关文章

  1. jQuery中.bind() .live() .delegate() .on()的区别 和 三种方式写光棒事件 动画

    地狱的镰刀 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数. $("a").bind("click",function(){ ...

  2. 【转】jQuery中.bind() .live() .delegate() .on()的区别

    bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 $("a").bind("click",function(){alert(& ...

  3. jQuery中.bind() .live() .delegate() .on()的区别

    bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 $("a").bind("click",function(){alert(& ...

  4. jQuery中bind() live() delegate() on() 的区别

    实例 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 $("a").bind("click",function(){aler ...

  5. jQuery中bind方法和live方法区别解析

    Javascript中的事件有它的独特性,有默认的执行事件,例如冒泡就是其中的一个.在很多比较复杂的应用程序中,停止事件的冒泡或捕获在程序开发当中是十分有用的,而在IE中有它的独特方式来阻止事件的冒泡 ...

  6. jQuery 中bind(),live(),delegate(),on() 区别(转)

    当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...

  7. 转 jQuery 中bind(),live(),delegate(),on() 区别

    当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...

  8. jquery实现input输入框实时输入触发事件代码 ---jQuery 中bind(),live(),delegate(),on() 区别

    复制代码 代码如下: <input id="productName" name="productName" value="" /> ...

  9. jQuery中.bind() .live() .delegate() .on()区别

    $(selector).bind(event,data,function) $(selector).live(event,data,function)//jquery1.9版本以下支持,jquery1 ...

随机推荐

  1. 【LeetCode-面试算法经典-Java实现】【118-Pascal&#39;s Triangle(帕斯卡三角形)】

    [118-Pascal's Triangle(帕斯卡三角形(杨辉三角))] [LeetCode-面试算法经典-Java实现][全部题目文件夹索引] 原题 Given numRows, generate ...

  2. wamp 两个不同的php.ini

    最近在本地开发的windows wamp环境安装一个vld 扩展,碰见一个奇怪的问题,phpinfo() 有 而cli 命令模式里面却没有 最后发现wamp phpinfo()和cli命令模式指向的p ...

  3. bzoj3992【SDOI2015】序列统计

    3992: [SDOI2015]序列统计 Time Limit: 30 Sec  Memory Limit: 128 MB Submit: 673  Solved: 327 [Submit][Stat ...

  4. Django安装和启动

    1.django安装 在http://www.djangoproject.com/download/这个网站上可以下载django的最新版本.在下载时,要注意django版本和本机安装的Python版 ...

  5. Linux中的关机

    我是用普通用户登录,在终端下输入shutdown命令,结果显示 command not found.这就奇怪了,难道我的linux不支持这个命令?man了一下shutdown,大篇幅的说明告诉我,我的 ...

  6. git介绍和常用指令

    Git介绍和常用指令 介绍:Git和SVN一样都是版本控制工具.不同的是Git是分布式的,SVN是集中式的.Git开始用可能感觉难点,等你用习惯了你就会觉得svn是有点恐怖.(如果一个项目有好多人一起 ...

  7. Myeclipse 文件注释和解注释

    我用的是myeclipse10.6, 在xml中 注释可以用: ctrl+shift+/ (段落注释) ctrl+shift+c (行注释) 解除注释可以用: ctrl+shift+\ 在proper ...

  8. 软件测试人员需要精通的开发语言(3)--- Linux

    Linux是一套免费使用和自由传播的类Unix操作系统,是一个基于POSIX和UNIX的多用户.多任务.支持多线程和多CPU的操作系统.不得不说下,中国产的红旗系统,牛的一逼,造价很贵,但具体何用处估 ...

  9. 【基础版限时免费】致敬WebForms,ASP.NET Core也能这么玩!

    ASP.NET WebForms ASP.NET WebForms 随着微软 2000 年的 .Net Framework 一起发布,至今也将近 20 年的时间.相信很多人和我一样,对 WebForm ...

  10. 今天在网上查看了一个socket程序,运行的时候一直报错,经过队友解决?

    1.首先是问题代码ip_port = ('192.168.12.2',8001)2.上边的代码本身没有问题,但是必须经过修改自己本机的局域网IP地址才能顺利链接请参考上一篇blog的地址,查看本机的i ...