Сценарий Jquery для отслеживания событий щелчка по ссылке для Universal Analytics

Question

Я пытаюсь настроить отслеживание событий с помощью Google Universal Analytics. Я нашел пример сценария, который, кажется, делает именно то, что мне нужно - т.е. отслеживает различные щелчки якоря на странице и классифицирует их соответственно. Однако мое понимание javascript все еще находится в зачаточном состоянии, и мне нужна помощь, чтобы понять, почему этот сценарий не работает. По сути, события кликов вообще не запускаются. Я проверил - скрипт загружен нормально и может отображать окно предупреждения сразу после загрузки. Скрипт помещается последним в заголовок страницы после загрузки analytics.js и Jquery.

Надеюсь, это что-то очевидное, чего мне не хватает, большое спасибо. Роберт

<script type='text/javascript'>
if (typeof jQuery != 'undefined') {
    var filetypes = /\.(zip|exe|dmg|pdf|doc.*|xls.*|ppt.*|mp3|txt|rar|wma|mov|avi|wmv|flv|wav)$/i;
    var baseHref = '';
    if (jQuery('base').attr('href') != undefined) baseHref = jQuery('base').attr('href');
    var hrefRedirect = '';

    jQuery('body').on('click', 'a', function(event) {

        var el = jQuery(this);
        var track = true;
        var href = (typeof(el.attr('href')) != 'undefined' ) ? el.attr('href') : '';
        var isThisDomain = href.match(document.domain.split('.').reverse()[1] + '.' + document.domain.split('.').reverse()[0]);
        if (!href.match(/^javascript:/i)) {
            var elEv = []; elEv.value=0, elEv.non_i=false;
            if (href.match(/^mailto\:/i)) {
                elEv.category = 'email';
                elEv.action = 'click';
                elEv.label = href.replace(/^mailto\:/i, '');
                elEv.loc = href;
            }
            else if (href.match(filetypes)) {
                var extension = (/[.]/.exec(href)) ? /[^.]+$/.exec(href) : undefined;
                elEv.category = 'download';
                elEv.action = 'click-' + extension[0];
                elEv.label = href.replace(/ /g,'-');
                elEv.loc = baseHref + href;
            }
            else if (href.match(/^https?\:/i) && !isThisDomain) {
                elEv.category = 'external';
                elEv.action = 'click';
                elEv.label = href.replace(/^https?\:\/\//i, '');
                elEv.non_i = true;
                elEv.loc = href;

            }
            else if (href.match(/^https?\:/i) && isThisDomain) {
                elEv.category = 'internal';
                elEv.action = 'click';
                elEv.label = href.replace(/^https?\:\/\//i, '');
                elEv.non_i = true;
                elEv.loc = href;

            }            
            else if (href.match(/^tel\:/i)) {
                elEv.category = 'telephone';
                elEv.action = 'click';
                elEv.label = href.replace(/^tel\:/i, '');
                elEv.loc = href;
            }
            else track = false;


            if (track) {
                var ret = true;

                if((elEv.category == 'external' || elEv.category == 'download') && (el.attr('target') == undefined || el.attr('target').toLowerCase() != '_blank') ) {
                    hrefRedirect = elEv.loc;

                    ga('send','event', elEv.category.toLowerCase(),elEv.action.toLowerCase(),elEv.label.toLowerCase(),elEv.value,{
                        'nonInteraction': elEv.non_i ,
                        'hitCallback':gaHitCallbackHandler
                    });

                    ret = false;
                }
                else {
                    ga('send','event', elEv.category.toLowerCase(),elEv.action.toLowerCase(),elEv.label.toLowerCase(),elEv.value,{
                        'nonInteraction': elEv.non_i
                    });
                }

                return ret;
            }
        }
    });

    gaHitCallbackHandler = function() {
        window.location.href = hrefRedirect;
    }
}
</script>

Answer 1

Из того, что вы дали, есть несколько вещей, которые могут пойти не так, как надо

1. Здесь нет base тег на странице. Вам нужно иметь <base href="" /> на странице
2. Сценарий добавлен внутри head, Тогда body элемент все еще не загружен, поэтому вам нужно добавить скрипт внутри обработчика dom ready / зарегистрировать делегированный обработчик в document объект вместо body

Предполагая, что jQuery загружен правильно и он добавлен до того, как этот скрипт попробует

<base href="yourbaseurl" />

затем

if (typeof jQuery != 'undefined') {
    jQuery(function(){
        var filetypes = /\.(zip|exe|dmg|pdf|doc.*|xls.*|ppt.*|mp3|txt|rar|wma|mov|avi|wmv|flv|wav)$/i;
        var baseHref = '';
        if (jQuery('base').attr('href') != undefined) baseHref = jQuery('base').attr('href');
        var hrefRedirect = '';

        jQuery('body').on('click', 'a', function(event) {

            var el = jQuery(this);
            var track = true;
            var href = (typeof(el.attr('href')) != 'undefined' ) ? el.attr('href') : '';
            var isThisDomain = href.match(document.domain.split('.').reverse()[1] + '.' + document.domain.split('.').reverse()[0]);
            if (!href.match(/^javascript:/i)) {
                var elEv = []; elEv.value=0, elEv.non_i=false;
                if (href.match(/^mailto\:/i)) {
                    elEv.category = 'email';
                    elEv.action = 'click';
                    elEv.label = href.replace(/^mailto\:/i, '');
                    elEv.loc = href;
                }
                else if (href.match(filetypes)) {
                    var extension = (/[.]/.exec(href)) ? /[^.]+$/.exec(href) : undefined;
                    elEv.category = 'download';
                    elEv.action = 'click-' + extension[0];
                    elEv.label = href.replace(/ /g,'-');
                    elEv.loc = baseHref + href;
                }
                else if (href.match(/^https?\:/i) && !isThisDomain) {
                    elEv.category = 'external';
                    elEv.action = 'click';
                    elEv.label = href.replace(/^https?\:\/\//i, '');
                    elEv.non_i = true;
                    elEv.loc = href;

                }
                else if (href.match(/^https?\:/i) && isThisDomain) {
                    elEv.category = 'internal';
                    elEv.action = 'click';
                    elEv.label = href.replace(/^https?\:\/\//i, '');
                    elEv.non_i = true;
                    elEv.loc = href;

                }            
                else if (href.match(/^tel\:/i)) {
                    elEv.category = 'telephone';
                    elEv.action = 'click';
                    elEv.label = href.replace(/^tel\:/i, '');
                    elEv.loc = href;
                }
                else track = false;


                if (track) {
                    var ret = true;

                    if((elEv.category == 'external' || elEv.category == 'download') && (el.attr('target') == undefined || el.attr('target').toLowerCase() != '_blank') ) {
                        hrefRedirect = elEv.loc;

                        ga('send','event', elEv.category.toLowerCase(),elEv.action.toLowerCase(),elEv.label.toLowerCase(),elEv.value,{
                            'nonInteraction': elEv.non_i ,
                            'hitCallback':gaHitCallbackHandler
                        });

                        ret = false;
                    }
                    else {
                        ga('send','event', elEv.category.toLowerCase(),elEv.action.toLowerCase(),elEv.label.toLowerCase(),elEv.value,{
                            'nonInteraction': elEv.non_i
                        });
                    }

                    return ret;
                }
            }
        });

        var gaHitCallbackHandler = function() {
            window.location.href = hrefRedirect;
        }    
    });
}