jquery两种绑定点击事件的click与live区别

前言

在jquery中绑定点击事件的方法有click(function)以及live(‘click’,function)等，下面说明一下这两种绑定点击事件的区别与联系，以及应用场景。

具体说明

click方法：

$(document).ready(function() {  
    $('.statistics').click(function() {  
        console.log('hello ga statistics');  
    });  
});

live方法：

$(document).ready(function() { 
   $('.statistics').live('click', function() {  
        console.log('hello ga statistics');  
   });  
});

两种方法的区别

通click直接绑定点击的方式，如果在文档流中，后续还有通过js脚本动态添加的元素(符合class=”statistics”)，对于这些元素是不会再绑定click事件的；但是如果通过live(‘click’,function(){…});方式绑定的话，后续加入文档流中的元素(符合class=”statistics”)也会自动绑定点击事件的。
当然live方法除了可以绑定click事件外，还可以绑定其他类型的事件，根据前面的事件名称进行指定，例如：live(‘click’, function(){…})。

应用场景

click(function(){…});绑定事件的方式很常见，需要注意的是同一个元素是可以绑定多个点击事件的，所以绑定事件的时候要小心，别把同一个点击行为绑定了多次，导致请求被重复提交等问题。

live(‘click’, function(){…});常用于对文档流中的元素添加统计行为场景，比如，我们要开发一个类似google ga统计的js框架，当文档流中符合条件的元素点击，或鼠标移上等行为触发时，将行为数据发给大数据中心；
当嵌入了统计js的页面被访问时，立即触发PV统计，发送数据给大数据中心–页面刷新，js脚本初始化，发送PV统计（这个与live无关）。