摘要:本篇jQuery实战教程将讲解为动态添加元素添加事件,看完这篇文章会让你对有更加清晰的理解和运用。
本篇jQuery实战教程将讲解为动态添加元素添加事件,看完这篇文章会让你对有更加清晰的理解和运用。
以前我们定义事件,比如为元素定义单击事件是这样写的:
$('input').click(function () {
//处理代码
});//或者是
$('.clickme').bind('click', function() {
// Bound handler called.
});
但是这只能是对已经加载好的元素定义事件,那些后来添加插入的元素则需要另行绑定。即使你使用jquery的clone函数,它并不能将事件也复制(到目前为止我还不清楚它是为什么这样定义,是没法复制还是刻意这么处理,以防止出现某些异常,这还有待去分析一下jquery的源代码)。
现在,使用live你可以轻松搞定,
$('.clickme').live('click', function() {
// Live handler called.
});
这样,你即使在后面动态插入的元素,也会被绑定事件,
$('body').append('<div class="clickme">Another target</div>');
定义和用法:jQuery 给所有匹配的元素附加一个事件处理函数,即使这个元素是以后再添加进来的也有效。
问题:使用jQuery的live()方法绑定事件,有时会出现重复绑定的情况,如,当点击一个按钮时,此按钮所绑定的事件会并执行n遍。
解决:使用die()方法,在live()方法绑定前,将此元素上的前面被绑定的事件统统解除,然后再通过live()方法绑定新的事件。
//先通过die()方法解除,再通过live()绑定
$("#selectAll").die().live("click",function(){
//事件运行代码
});//先通过die()方法解除,再通过live()绑定
$("#selectAll").die().live("click",function(){
//事件运行代码
});
jQuery 1.7以后就不支持了。。。。
As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live(). - .live() | jQuery API Documentation
希望这篇文章可以帮助到你。总之,同学们,你想要的职坐标IT频道都能找到!
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了,明天再试试吧!
我们会在第一时间安排职业规划师联系您!
您也可以联系我们的职业规划师咨询:
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
沪公网安备 31011502005948号