javascript 利用Image對(duì)象實(shí)現(xiàn)的埋點(diǎn)(某處的點(diǎn)擊數(shù))統(tǒng)計(jì)
更新時(shí)間：2012年12月28日 10:26:00 作者：
統(tǒng)計(jì)用戶頁(yè)面某處的點(diǎn)擊數(shù)或者執(zhí)行到程序中某個(gè)點(diǎn)的次數(shù);根據(jù)實(shí)際情況，創(chuàng)建多個(gè)Image對(duì)象，原則誰(shuí)空閑誰(shuí)做事，解下來(lái)詳細(xì)介紹，需要了解的朋友可以參考下
需求：統(tǒng)計(jì)用戶頁(yè)面某處的點(diǎn)擊數(shù)或者執(zhí)行到程序中某個(gè)點(diǎn)的次數(shù)
特點(diǎn)：根據(jù)實(shí)際情況，創(chuàng)建多個(gè)Image對(duì)象，原則誰(shuí)空閑誰(shuí)做事。解決因過(guò)快發(fā)送埋點(diǎn)數(shù)據(jù)導(dǎo)致部分埋點(diǎn)缺失的問(wèn)題。
實(shí)現(xiàn)：（注下面的代碼依賴jQuery）
var Statistic= {
arrImg:[],
log:function(from){
//如果參數(shù)為空，則不處理
if(typeof(from)=="undefined" || from=="") return;
var me=this,img,imgHandler,arrImg,len=0,index=-1;
arrImg=me.arrImg;
len=arrImg.length;
//查詢可用的Image對(duì)象
for(var i=0;i<len;i++){
if(arrImg[i].f==0){
index=i;
break;
}
}
//取出或者生成Image對(duì)象
if(index==-1){
img=$(new Image());
arrImg.push({f:1,img:img});
index=(len==0?0:len);
}else{
img=arrImg[index].img;
}
//標(biāo)記Image對(duì)象為正在使用狀態(tài)
arrImg[index].f=1;
//記錄所使用的Image對(duì)象的位置
img.data("vid",index);
imgHandler = function(){
var vid=$(this).data("vid");
if(vid>=0){
arrImg[vid].f=0;
}
};
img.unbind().load(imgHandler).error(imgHandler);
var arr = [],ref,url="http://z.ccccccc.com/beacon.gif?";
ref = document.referrer;
if (ref) {
ref=encodeURIComponent(ref);
}else{
ref='';
}
//必須嚴(yán)格按照以下的先后順序：t,r,from,version
arr.push('t='+ (new Date()).getTime());
arr.push('r='+ref);
$(img).attr("src",url+ arr.join('&'));
}
};
特點(diǎn)：根據(jù)實(shí)際情況，創(chuàng)建多個(gè)Image對(duì)象，原則誰(shuí)空閑誰(shuí)做事。解決因過(guò)快發(fā)送埋點(diǎn)數(shù)據(jù)導(dǎo)致部分埋點(diǎn)缺失的問(wèn)題。
實(shí)現(xiàn)：（注下面的代碼依賴jQuery）
復(fù)制代碼 代碼如下:
var Statistic= {
arrImg:[],
log:function(from){
//如果參數(shù)為空，則不處理
if(typeof(from)=="undefined" || from=="") return;
var me=this,img,imgHandler,arrImg,len=0,index=-1;
arrImg=me.arrImg;
len=arrImg.length;
//查詢可用的Image對(duì)象
for(var i=0;i<len;i++){
if(arrImg[i].f==0){
index=i;
break;
}
}
//取出或者生成Image對(duì)象
if(index==-1){
img=$(new Image());
arrImg.push({f:1,img:img});
index=(len==0?0:len);
}else{
img=arrImg[index].img;
}
//標(biāo)記Image對(duì)象為正在使用狀態(tài)
arrImg[index].f=1;
//記錄所使用的Image對(duì)象的位置
img.data("vid",index);
imgHandler = function(){
var vid=$(this).data("vid");
if(vid>=0){
arrImg[vid].f=0;
}
};
img.unbind().load(imgHandler).error(imgHandler);
var arr = [],ref,url="http://z.ccccccc.com/beacon.gif?";
ref = document.referrer;
if (ref) {
ref=encodeURIComponent(ref);
}else{
ref='';
}
//必須嚴(yán)格按照以下的先后順序：t,r,from,version
arr.push('t='+ (new Date()).getTime());
arr.push('r='+ref);
$(img).attr("src",url+ arr.join('&'));
}
};
相關(guān)文章
JavaScript中使用sencha gridpanel 編輯單元格、改變單元格顏色
ExtJS中的表格功能非常強(qiáng)大，包括了排序、緩存、拖動(dòng)、隱藏某一列、自動(dòng)顯示行號(hào)、列匯總、單元格編輯等實(shí)用功能，通過(guò)本篇文章給大家介紹JavaScript中使用sencha gridpanel 編輯單元、改變單元格顏色，感興趣的朋友一起學(xué)習(xí)2015-11-11
使用DeviceOne實(shí)現(xiàn)微信小程序功能
本文主要對(duì)小程序的優(yōu)缺點(diǎn)和DeviceOne的特點(diǎn)進(jìn)行介紹，分享了使用DeviceOne實(shí)現(xiàn)微信小程序功能的實(shí)例代碼，具有一定的參考價(jià)值。下面跟著小編一起來(lái)看下吧2016-12-12
JS實(shí)現(xiàn)仿雅虎首頁(yè)快捷登錄入口及導(dǎo)航模塊效果
這篇文章主要介紹了JS實(shí)現(xiàn)仿雅虎首頁(yè)快捷登錄入口及導(dǎo)航模塊效果,涉及JavaScript響應(yīng)鼠標(biāo)事件遍歷頁(yè)面元素的實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09
這篇文章主要介紹了淺談JS中this在各個(gè)場(chǎng)景下的指向，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-08-08
JS模仿騰訊圖片站的圖片翻頁(yè)按鈕效果完整實(shí)例
這篇文章主要介紹了JS模仿騰訊圖片站的圖片翻頁(yè)按鈕效果,涉及javascript動(dòng)態(tài)操作頁(yè)面元素屬性的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06
這篇文章主要介紹了js關(guān)于命名空間的函數(shù),實(shí)例講述了namespace函數(shù)的使用技巧,需要的朋友可以參考下2015-02-02
layer關(guān)閉彈出窗口觸發(fā)表單提交問(wèn)題的處理方法
今天小編就為大家分享一篇layer關(guān)閉彈出窗口觸發(fā)表單提交問(wèn)題的處理方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09
由于前端開(kāi)發(fā)的火熱和一些IT巨頭公司 對(duì) web前端開(kāi)發(fā)人員的需求旺盛，讓越來(lái)越多的人轉(zhuǎn)入前端。今天就為大家分享了一份Web前端開(kāi)發(fā)書(shū)單，希望大家喜歡2017-10-10
Javascript實(shí)現(xiàn)頁(yè)面滾動(dòng)時(shí)導(dǎo)航智能定位
本篇文章主要介紹了Javascript實(shí)現(xiàn)頁(yè)面滾動(dòng)時(shí)導(dǎo)航智能定位，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-05-05
這篇文章主要給大家介紹了關(guān)于微信小程序請(qǐng)求前置的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03