php - 通用分析不跟踪导致弹出窗口的链接

Question

我最近接管了一个小型学校网站，该网站正在使用一些非常复杂的分析，例如 UA 和 GA 的混合。所以我剥离了所有旧的分析代码，创建了一个新帐户，并让一切都与 UA 一起运行。我只跟踪链接点击，因此代码不会太复杂。我遇到的问题是导致弹出窗口的链接不会发送事件。当我实时观看事件时，指向新页面的链接会完美地发送事件，但只会导致弹出窗口的链接不会。在以下代码段中，第一个链接指向另一个页面并进行跟踪，第二个链接生成一个弹出窗口并且不进行跟踪。

<tr>
<td class="tableCenterBoxes">
	<a href="http://bit.ly/nutritionCalculator"
	   target="_blank"
	   onclick="ga('send', 'event', 'quickLinks', 'nutritionCalculator');">
		Nutrition Calculator
	</a>
</td>
</tr>
<tr>
<td class="tableCenterBoxes">
	<a href="popups/ClubsAndOrganizationsFall2015.pdf"
	   rel="clearbox[gallery=Resources,,width=650,,height=500,,title=Clubs and Organizations]"
	   onclick="ga('send', 'event', 'quickLinks', 'clubsAndOrganizations');">
		Clubs and Organizations
	</a>
</td>
</tr>

我不知道为什么会这样，所以非常感谢您的帮助。谢谢。

Answer 1

绑定(bind)事件

我看到你使用了一些 clearbox 插件，这个插件是由 rel 参数设置的。页面加载后，clearbox 中的脚本在每个 rel=clearbox 参数上设置事件监听器并设置其新行为。它可能会取消绑定(bind)以前的 onclick 元素，例如您的 GA 代码。这是一个问题，您可以尝试用几种不同的方法来解决它。

快速而肮脏

在页面加载延迟后通过 javascript 设置此 onclick 监听器 - 例如加载后 1-2 秒。这只是在您使用 ClearBox 的弹出链接中的现有配置中再添加一个 onclick 事件。

正确的做法

Clearbox 库有一些回调函数。

CB_AllowExtFunctLoad='on'调用函数CB_ExternalFunctionLoad();每次加载新内容后。在此功能中，您可以自定义 ga("send"...) 调用...

CB_AllowExtFunctPageLoad='on'调用名为 CB_ExternalFunctionPageLoad() 的函数；在您的页面完全加载后。这是在全局范围内设置自定义事件监听器的正确位置。

---

您可以在以下部分的 clearbox 文档中阅读更多信息:Clearbox 专业设置:http://kreaturamedia.com/clearbox/index_en.html

---

更新

您设置的事件监听器可以如下所示(jQuery 示例):

jQuery

<a href="popups/ClubsAndOrganizationsFall2015.pdf"
 rel="clearbox[gallery=Resources,,width=650,,height=500,,title=Clubs and Organizations]"
 data-description="clubsAndOrganizations">
    Clubs and Organizations
</a> 

<script>
var CB_AllowExtFunctPageLoad = function(){
 $(".tableCenterBoxes a").onclick(function(){
   var desc = $(this).attr("data-description");
   ga('send', 'event', 'quickLinks', desc);
 }); 
}
</script>

纯Javascript

<script>

function CB_ExternalFunctionLoad() { 

    var classname = document.getElementsByClassName("popup");

    var gaSetter = function() {
        var cat = this.getAttribute("data-category");
        var desc = this.getAttribute("data-description");
        ga('send', 'event', cat, desc);      
    };  

    for(var i=0;i<classname.length;i++){
       classname[i].addEventListener('click', gaSetter, false);
    }

}
</script>