GA //通过一个生成独特输出的类跟踪onClick事件?

时间:2012-10-23 16:01:16

标签: javascript jquery google-analytics

以下是我一直在尝试的代码;我基本上只是想用它来跟踪通用GA的页面;然后分配一个跟踪类别中的onClick事件的类,并在文件名的末尾自动生成1,2,3。我本质上只是想简化在网站中跟踪我的onClick文件;我不想继续手动将onClick代码添加到我试图在页面上跟踪的每个文件。 以下代码有什么问题?

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-35609953-1']);
  _gaq.push(['_trackPageview']);
  _gaq.push(['_trackEvent', 'Downloads', 'JPG', '/downloads/img/LowRes01.jpg']);


  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

<!-- GA track all onClicks -->

<script>
$(function(){
    $('.downloadsmall a').attr("onclick", function(i){
        var x='LowRes0'+(i+1)+'.jpg';
        return "_gaq.push(['_trackPageview', '/downloads/img/"+x+"'])";
        return "_gaq.push(['_trackEvent', 'Downloads', 'JPG', '/downloads/img/"+x+"'])";

    });
});​
</script>

<!-- End GA track all onClicks -->

<style>

#wrap {
    width: 940px;
    margin-left: 0 auto;
}

#left {
    width: 50%;
    float: left;
}

#right {
    width: 50%;
    float: right;
}

.downloadsmall {
height: 50px;
width: 200px;
border: 3px dotted #333;
}


</style>

</head>

<body>

    <div id="wrap"><!-- Wrap -->

    <div id="left">

<p class="downloadsmall">
    download: <a href="http://www.google.com">Low Res</a>
</p>

    </div>

  <div id="right">

<p class="downloadsmall">
    download: <a href="http://www.yahoo.com">Low Res</a>
</p>

    </div>
    </div><!-- Wrap -->

更新----

以下是根据Jasper的回复更新的代码; (谢谢!)我已经进入并正在等待它如何解决。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

<!-- GA track all onClicks -->

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-35609953-1']);
  _gaq.push(['_trackPageview']);
  _gaq.push(['_trackEvent', 'Downloads', 'JPG', '/downloads/img/"+x+"']);


$(function(){
    $('.downloadsmall a').on("click", function(){
        var theHREF = $(this).attr('href'),
            myGAQ   = _gaq || [];
        myGAQ.push(['_trackPageview', theHREF]);
        myGAQ.push(['_trackEvent', 'Downloads', 'JPG', theHREF]);

    });
});

</script>

<!-- End GA track all onClicks -->

1 个答案:

答案 0 :(得分:2)

您正在从事件处理程序返回一个字符串,该字符串实际上不会执行任何操作。相反,只需正常运行代码。此外,一旦你return函数中的某些东西,函数就会停止执行,所以你的第二个return甚至都没有被运行。

试试这个:

$(function(){
    $('.downloadsmall a').on("click", function(i){
        var x     = 'LowRes0'+(i+1)+'.jpg',
            myGAQ = _gaq || [];
        myGAQ.push(['_trackPageview', '/downloads/img/' + x]);
        myGAQ.push(['_trackEvent', 'Downloads', 'JPG', '/downloads/img/' + x]);

    });
});​

此代码实际上是访问GA _gaq对象并要求它创建页面视图和事件跟踪信标。

代码仍然不应该工作,因为事件处理程序中的i参数实际上是event对象,而不是索引(我假设是你想要的)。您可以获得链接的实际HREF并将其用作跟踪数据:

$(function(){
    $('.downloadsmall a').on("click", function(){
        var theHREF = $(this).attr('href'),
            myGAQ   = _gaq || [];
        myGAQ.push(['_trackPageview', theHREF]);
        myGAQ.push(['_trackEvent', 'Downloads', 'JPG', theHREF]);

    });
});​