jQuery中bind与live的用法与区别
首先介绍这两个方法之前,我们常用的是click()方法
$("a").click(function() {
alert("hello");
});
click()方法是bind()方法的一种简单方法。在bind()中,
jQuery所有JavaScript事件对象,比如focus, mouseover,和resize,
都是可以作为type参数传递进来的。
参数:type,[data],function(eventObject)
例如:
$("p").bind("click",function(){
alert("hello");
})
也可以传参
var message = "how are you!";
$("p").bind("click",{msg:message},function(e){
alert(e.data.msg);
})
live()给所有匹配的元素附加一个事件处理函数,
即使这个元素是以后再添加进来的也有效。如下:
<tr class="mytr">
<td class="mytd">Click me</td>
</tr> $(".mytd").bind("click",function(){
alert("hello");
})
点击Clike me 会弹出hello
此时添加一个新的元素进来
$(".mytr").after("<tr><td class='mytd'>后加的</td></tr>");
这时 再使用bind点击"后加的"不会执行
改为使用live()方法
$(".mytd").live("click",function(){
alert("hello");
})
.live()方法能对一个还没有添加进DOM的元素有效,是由于使用了事件委托:
绑定在祖先元素上的事件处理函数可以对在后代上触发的事件作出回应。
传递给 .live() 的事件处理函数不会绑定在元素上,而是把他作为一个特殊的事件处理函数,绑定在 DOM 树的根节点上。
jQuery中bind与live的用法与区别的更多相关文章
- Jquery中bind和live.one,delegate的区别
Jquery中绑定事件有三种方法:以click事件为例 (1)target.click(function(){}); (2)target.bind("click",function ...
- jQuery中delegate与on的用法与区别
在jQuery1.7中 .delegate()已被.on()取代.对于早期版本,它仍然使用事件委托的最有效手段. 在事件绑定和委派,delegate()和on在一般情况下,这两种方法是等效的. .de ...
- jQuery中bind()与on()绑定事件的区别
.on()方法比.bind()方法多一个参数selector .on()的selector参数是筛选出调用.on()方法的dom元素的指定子元素,如: $("ul").on('cl ...
- jQuery中bind方法和live方法区别解析
Javascript中的事件有它的独特性,有默认的执行事件,例如冒泡就是其中的一个.在很多比较复杂的应用程序中,停止事件的冒泡或捕获在程序开发当中是十分有用的,而在IE中有它的独特方式来阻止事件的冒泡 ...
- jquery中append跟prepend的用法
jquery中append和prepend的用法 append 是插入到元素中,并放到元素内的最后面prepend 是插入到元素中,并放到元素内的最前面例$("body"). ...
- jquery中attr()与prop()函数用法实例详解(附用法区别)
本文实例讲述了jQuery中attr()与prop()函数用法.分享给大家供大家参考,具体如下: 一.jQuery的attr()方法 jquery中用attr()方法来获取和设置元素属性,attr是a ...
- JQuery中bind和unbind函数与onclick绑定事件区分
JQuery中bind和unbind函数转载: https://blog.csdn.net/liucheng417/article/details/51131982 页面代码: <body& ...
- jQuery中的text(),html(),val()用法
jQuery中的text(),html(),val()用法 text():获取或者改变指定元素的文本 html():获取或改变指定元素的html元素以及文本 val():获取或者改变指定元素的valu ...
- jquery中this与$(this)的用法区别
jquery中this与$(this)的用法区别.先看以下代码: $("#textbox").hover( function() { this.title = "Test ...
随机推荐
- 使用Json让Java和C#沟通的方法
原文:使用Json让Java和C#沟通的方法 最近很忙啊,新项目下来了,都没时间写博客了.频率降低点,但不能不总结跟大家分享啊. 我们在项目里经常要涉及到各模块间的通信,这其中又不可避免要碰到各类语言 ...
- HDU 3523 Image copy detection(KM最大匹配)
HDU 3523 Image copy detection 题目链接 题意:这题事实上题意读懂就简单了,说白了就是1-n放到1-n列,每列的值为每列上数字和该数字的差的绝对值,然后求总和最小 思路:就 ...
- 在面对变化,撇开NO
参观后转到供应商,看到自己的生产线流水线半自己的钣金生产线举措.这就是我一直想厂提高生产现场的想法,因为通常当我看到工作人员努力工作和繁忙的生产,只见废现场,线解决方式时,有点莫名的兴奋. 幸亏是一家 ...
- ajax form表单提交 input file中的文件
ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...
- easyui datagrid footer 页脚问题
mvc 的一个例子 public string IndexV2() { var dataGridJson = new DataGridJson(); var data = new List<My ...
- zoj 3822 Domination(dp)
题目链接:zoj 3822 Domination 题目大意:给定一个N∗M的棋盘,每次任选一个位置放置一枚棋子,直到每行每列上都至少有一枚棋子,问放置棋子个数的期望. 解题思路:大白书上概率那一张有一 ...
- Javscript轮播 支持平滑和渐隐两种效果(可以只有两张图)
原文:Javscript轮播 支持平滑和渐隐两种效果(可以只有两张图) 先上两种轮播效果:渐隐和移动 效果一:渐隐 1 2 3 4 效果二:移动 1 2 3 4 接下来,我们来大致说下整个轮播的思 ...
- Ionic项目中使用极光推送-android
对于Ionic项目中使用消息推送服务,Ionic官方提供了ngCordova项目,这个里面的提供了用angularjs封装好的消息推送服务(官方文档),使用的是GitHub上的 PushPlugin ...
- Responsive Design in 3 Steps
Responsive web design is no doubt a big thing now. If you still not familiar with responsive design, ...
- 使用collectd与visage收集kvm虚拟机性能实时图形
软件功能: 通过collectd软件来监控收集kvm虚拟机的性能数据,包含cpu,memory.磁盘IO.网络流量等 通过visage软件将收集到的数据绘制图形. 安装: 系统环境:ubuntu12. ...