首页 > jQuery的live()与click()区别是什么?

jQuery的live()与click()区别是什么?

最近发现挺多代码是用live()绑定事件,而且经常没有在外部包裹ready()

$('#id').live('click', function() {
    console.log('hello');
});

而通常情况下,我们绑定事件方法都是用:

$(document).ready(function() {
    $('#id').click(function() {
        console.log('hello');
    });
});

他们之间有什么区别吗?为什么要这样写?


  1. live 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素(比如由脚本创建的新元素)
  2. click方法附加的事件处理程序适用于匹配选择器的当前元素

$(...).click(function(){})在执行时,有哪些符合前面选择器的,则那些元素的click事件被设置,之后由js动态添加的dom元素,虽然也符合选择器,但他的click没有被设置。如果希望js动态添加的元素也可以自动添加click,则可以使用$(...).live("click",function(){})


http://jsrun.net/tkKKp

click是绑在#id上;

live是一个事件委托,绑在document上,判断触发事件的元素是否为#id。


click适合单一元素

http://jsfiddle.net/PkNT6

live('click',function(){ .. }) 是事件委托, 适用符合条件的多个元素, 一是比较简单,涉及元素变动不需要频繁修改, 二是元素比较多的情况下效率比较高

http://jsfiddle.net/PkNT6/1

jquery 1.7版后建议用on替代live, live在今后的版本会被移除

http://jsfiddle.net/PkNT6/2

【热门文章】
【热门文章】