jQuery中bind与live的用法及区别小结
2019/6/29 22:39:42
本文主要是介绍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的用法及区别小结的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-03-06jquery对css样式(jquery中的css方法)-icode9专业技术文章分享
- 2023-05-27JQuery的认识和安装
- 2023-01-06JQuery应用技巧:如何定义 HTML 模板并使用 JQuery 进行加载-icode9专业技术文章分享
- 2022-09-29复习-jQuery
- 2022-09-04Python3项目初始化10-->前端基础jquery、ajax,sweetalert--更新用户改造
- 2022-08-30day 27 jquery
- 2022-08-29jQuery筛选器,bootstrap
- 2022-08-20JQuery事件绑定
- 2022-08-20JQuery案例
- 2022-08-07关于jQuery的学习