百度事件跟踪统计代码封装和安装

作者：秋了秋发表时间：2016年06月07日

所谓事件跟踪，就是通过代码记录访客在网页中具体操作了什么，比如点击了哪个地方，执行了表单的提交搜索。这一系列都可以记录下来，而百度就提供了一个这么方便的事件跟踪接口供我们使用。在这里我基于jq对百度的接口代码的使用进行了封装，简化了使用。

百度事件跟踪其实是百度流量统计的而一个分支，所以要想使用事件跟踪，前提是要使用百度统计，即你的页面要有百度统计的代码，并且这个流量统计要在事件跟踪代码的前面执行。

假如你已经引入了百度统计的代码，那么只需要在后面加入以下的代码即可实现事件跟踪统计：

$(function(){
     _hmt.push(['_setAccount', 'd9369436322d94b2213525fa8711e642']);
     function eventCollect(ev,obj,category, action, opt_label){
       var arg=arguments.length;
       var txt=opt_label;
       $("html").on(ev,obj,function(){
         if(arg==5){
           _hmt.push(['_trackEvent', category, action, txt]);
         }else{
           var opt_label=$(this).text().replace(/\s/gi," ")||"未知按钮或图片"; 
           _hmt.push(['_trackEvent', category, action, opt_label]);
         } 
       })
     }
   eventCollect("click","#nav li","导航", "点击");
   eventCollect("click","#music","播放器", "点击", "第一次打开播放器");
})

把红色部分改为自己的站点id，使用方法像上面的蓝色代码，第一个参数是事件类型（一般为click和hover），第二个参数为事件选择器，第三个为类目，第四个为事件说明，第五个为事件详情（可选）。注意：安装代码可能会有一段时间不会立马显示出来，并不是代码错了，比如我的就是安装后半天后才会显示数据统计，稍安勿躁。

每一个事件只需要调一行代码就行，简单快捷了许多。

文章作者： “秋了秋”个人博客，本站鼓励原创。

转载请注明本文地址：http://netblog.cn/blog/446.html

目录: 前端编程标签: 事件跟踪 7459次阅读