Heim  >  Artikel  >  Web-Frontend  >  JS-Code zur Implementierung von Klickereignisstatistiken

JS-Code zur Implementierung von Klickereignisstatistiken

小云云
小云云Original
2018-03-26 17:26:312473Durchsuche

Dieser Artikel teilt Ihnen hauptsächlich den JS-Code zur Implementierung von Klickereignisstatistiken mit. Ich hoffe, er kann Ihnen helfen.

/** 
 * 点击事件上报,分为立即上报和延时上报,延时上报通过cookie存储。 
 *  
 * 一、配置参数,主要用于定义上报的一些配置信息。通过在外部定义_clickc对象重置参数。 
 *     参数名称       类型          默认值             说明 
 *     selector:      string        '_click_rp'        点击触发的选择器,支持ID、class 
 *     prefix:        string        '_rp_'             需要上报的参数属性名前缀,如_rp_type,表示要上报type参数的值 
 *     cookie:        string        '_click_rp'        延迟上报时的cookie名称 
 *     domain:        string        '.skye.com'    cookie存储的域名(可以通过使用的网站来获得) 
 *     delay:         boolean       false              是否延迟上报,延迟上报通过cookie实现 
 *     delay_attr:    string        _delay             标签中指定是否延迟上报,优先级最高,ture延时,其他不延时。 
 *

* 2. Externe Parameter, die hauptsächlich zum Definieren gemeldeter Parameter verwendet werden. Fügen Sie Parameter hinzu, indem Sie das _clickq-Array extern definieren.

*

* 3. Label-Parameter werden mit dem Präfix _rp_ definiert. Bei der Meldung werden alle Parameter gemeldet, die mit _rp_ beginnen. Es gibt zwei Parameterformate: eines sind reine Zeichen und das andere ist eine Rückruffunktion.

* 6602a3b93d16fd0b28eba340b975ec6da5db79b134e9f6b82c0b36e0489ee08ed, was angibt, dass der Parameter beim Berichten a=aa&b=bb

* 1, reines Zeichen, definiert direkt das Zeichen und gibt den Wert des Parameters an, der hochgeladen werden muss.

* 2, Rückruffunktion, beginnend mit Javascript:. Definieren Sie einfach den Funktionskörper und geben Sie den Wert des Parameters im Funktionskörper zurück.

* Zum Beispiel 74f4988aab1e20cb3d051a5eec73260f45a2772a6b6107b401db3c9b82c049c2Frage54bdf357c58b8a65c66d7c19c8e4d1145db79b134e9f6b82c0b36e0489ee08ed

*

* 4. Die verzögerte Berichterstattung ist in drei Prioritäten unterteilt, wie folgt von hoch nach niedrig

* 1. Ob das Tag-Attribut _delay als wahr angegeben ist, wenn ja, bedeutet dies eine verzögerte Berichterstattung.

* 2. Unabhängig davon, ob es sich um ein bestimmtes Etikett handelt, z. B. ein Etikett, ist dieses Fenster geöffnet (Ziel ist gleich „_self“ oder leer), Schaltfläche „Senden“.

* 3, der in den Konfigurationsparametern angegebene Verzögerungsparameter.

*

* 5. Unterstützung: Sie müssen sich auf das jQuery-Plug-in verlassen.

*

* 6. Anwendungsfälle

* 1. Einführung von JS

 * var _clickq = _clickq || []; 
 * _clickq.push(['param1', 'value1']); 
 * var _clickc = {selector:'_click_rps'}; 
 * (function() { 
 *  var click = document.createElement("script"); 
 *  click.src = "//cache.skye.com/js/lib/stat/click.js"; 
 *  var s = document.getElementsByTagName("script")[0];  
 *  s.parentNode.insertBefore(click, s); 
 * })();
* 2. Definition Selektoren und Upload-Parameter

 * 如,<a class="_click_rp" href="" _rp_a="aa" _rp_b="bb">a</a> 
 */  
(function () {  
    // 默认参数  
    var options = {  
        selector: &#39;_click_rp&#39;,  
        prefix: &#39;_rp_&#39;,  
        cookie: &#39;_click_rp&#39;,  
        domain: &#39;.skye.com&#39;,  
        delay: false,  
        delay_attr: &#39;_delay&#39;  
    };  
    var params = {};  
    var _params = {};  
    var clickObj = null; // 当前点击对象  
    // 获得对象  
    var getObject = function(selector) {  
        if (typeof(selector) == &#39;object&#39;) {  
            return selector;  
        } else {  
            var obj = $(&#39;#&#39;+selector);  
            if (obj.length) {  
                return obj;  
            }  
            obj = $(&#39;.&#39;+selector);  
            if (obj.length) {  
                return obj;  
            }  
            return null;  
        }  
    }  
    // 获得选择器  
    var getSelector = function(selector) {  
        return &#39;#&#39; + selector + &#39;,.&#39; + selector;  
    }  
    // 操作cookie函数  
    var getCookie = function(c_name) {  
        if (document.cookie.length>0) {  
            c_start = document.cookie.indexOf(c_name + "=")  
            if (c_start!=-1) {   
                c_start=c_start + c_name.length+1   
                c_end=document.cookie.indexOf(";",c_start)  
                if (c_end==-1) c_end=document.cookie.length  
                return unescape(document.cookie.substring(c_start,c_end))  
            }  
        }  
        return "";  
    }  
    var setCookie = function(c_name,value,expiredays,path,domain) {  
        var exdate = new Date()  
        exdate.setDate(exdate.getDate()+expiredays)  
        var cookie = c_name+ "=" +escape(value)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString());  
        if (path) cookie = cookie + ";path=" + path;  
        if (domain) cookie = cookie + ";domain=" + domain;  
        document.cookie = cookie;  
    }  
    // 获得标签中的参数  
    var getAttrParam = function() {  
        if ( clickObj ) {  
            var attrs = clickObj.get(0).attributes;  
            $.each(attrs, function(i) {  
                var name = attrs[i].name;  
                if ( name.indexOf(options.prefix) == 0 ) {  
                    name = name.replace(options.prefix, &#39;&#39;);  
                    var value = attrs[i].value;  
                    if ( value.indexOf(&#39;javascript:&#39;) == 0 ) {  
                        // 执行js获得参数值  
                        value = value.replace(&#39;javascript:&#39;, &#39;&#39;);  
                        eval(&#39;var valFun = function() {&#39;+ value +&#39;};&#39;);  
                        value = valFun();  
                    }  
                    params[name] = value;  
                }  
            });  
        }  
    }  
    // 获得默认参数  
    var getDefaultParam = function() {  
        if(document) {  
            params.url = document.URL || &#39;&#39;;  
            params.referrer = document.referrer || &#39;&#39;;  
        }  
        // 时间  
        var date = new Date();  
        params.ltime = date.getTime() / 1000;  
        // 时间戳  
        params.t = date.getTime();  
    }  
    var getParamStr = function() {  
        getAttrParam();  
        getDefaultParam();  
        // 合并配置参数  
        for(var key in _params) {  
            params[key] = _params[key];  
        }  
        //拼接参数串  
        var args = &#39;&#39;;   
        for(var i in params) {  
            if(args != &#39;&#39;) {  
                args += &#39;&&#39;;  
            }     
            args += i + &#39;=&#39; + encodeURIComponent(params[i]);  
        }  
        return args;  
    }  
    // 清空参数  
    var clearParam = function() {  
        params = {};  
    }  
    // 是否立即上报,如果跳转页面,则计入延时上报  
    var getIsDelay = function() {  
        if ( clickObj ) {  
            // 有具体指定  
            if ( clickObj.attr(options.delay_attr) == &#39;true&#39; ) {  
                return true;  
            }  
            // 特定标签  
            // a标签  
            if ( clickObj.is(&#39;a&#39;) ) {  
                if ( clickObj.attr(&#39;href&#39;).indexOf(&#39;javascript:&#39;) == 0 ) {  
                    return false;  
                }  
                if ( clickObj.attr(&#39;target&#39;) && clickObj.attr(&#39;target&#39;) != &#39;_self&#39; ) {  
                    return false;  
                }  
                return true;  
            }  
            // submit按钮  
            if ( (clickObj.is(&#39;input&#39;) || clickObj.is(&#39;button&#39;)) && clickObj.attr(&#39;type&#39;) == &#39;submit&#39; ) {  
                return true;  
            }  
        }  
        return options.delay;  
    }  
    // 加入cookie,下次上报  
    var setDelayCookie = function() {  
        // 获得参数  
        var args = getParamStr();  
        var cookieStr = getCookie(options.cookie);  
        if ( cookieStr == &#39;&#39; ) {  
            cookieStr = args;  
        } else {  
            cookieStr = cookieStr + &#39;,&#39; + args;  
        }  
        setCookie(options.cookie, cookieStr, 7, &#39;/&#39;, options.domain);  
        clearParam();  
    }  
    // 上报cookie  
    var rpCookie = function() {  
        // 获得cookie,循环操作  
        var cookieStr = getCookie(options.cookie);  
        if ( cookieStr ) {  
            var cookieArr = cookieStr.split(&#39;,&#39;);  
            for(var key in cookieArr){    
                rpClick(cookieArr[key]);  
            }    
            setCookie(options.cookie, &#39;&#39;, 7, &#39;/&#39;, options.domain);  
        }  
    }  
    // 上报  
    var rpClick = function(args) {  
        if ( args == undefined ) {  
            args = getParamStr();  
        }  
        var img = new Image(1, 1);  
        img.src = &#39;http://data.skye.com/stat/click?&#39; + args;  
        console.info(img.src);  
        clearParam();  
    }  
    // js上报函数  
    var rpComm = function(obj) {  
        console.info(&#39;click&#39;);  
        clickObj = obj;  
        if ( getIsDelay() ) {  
            setDelayCookie();  
        } else {  
            rpClick();  
        }  
    }  
    //解析外部配置  
    if(_clickc) {  
        for(var i in _clickc) {  
            options[i] = _clickc[i];  
        }     
    }  
    //解析外部参数  
    if(_clickq) {  
        for(var i in _clickq) {  
            _params[_clickq[i][0]] = _clickq[i][1];  
        }  
    }  
    // 提供外部js函数  
    $.rpComm = function(obj) {  
        rpComm(obj);  
    }  
    $.fn.rpComm = function() {  
        rpComm($(this));  
    }  
    // cookie中的上报  
    rpCookie();  
    // 初始化信息  
    var _time = new Date().valueOf();  
    var selector = getSelector(options.selector);  
    $(&#39;body&#39;).delegate(selector,&#39;click&#39;,function() {  
        // 连续点击限制  
        if(new Date().valueOf() - _time < 300) {  
            return;  
        }  
        _time = new Date().valueOf();  
        rpComm($(this));  
    });  
})();

Das obige ist der detaillierte Inhalt vonJS-Code zur Implementierung von Klickereignisstatistiken. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn