2015-08-28 148 views
1

我试图在着陆页上使用Google Analytics事件跟踪。我在页面的两个地方获得了代码,附加到两个元素上,跟踪这些元素的点击次数。按钮上的Google Analytics事件跟踪

在一个点 - 一个弹出式的灯箱视频 - 跟踪完美。它立即在GA中提取。

但是,在页面上的其他位置(更重要的位置)上,我似乎无法在GA中找到它。代码以完全相同的方式实施,并且在Chrome中使用Google Analytics调试器,两者似乎都在点击完全相同的信息。

在一个实例中,代码位于元素中的另一个中。

我附上了以下两段代码。

任何帮助都将非常感激。

工作的代码:

<a class="button" href="http://player.vimeo.com/video/134791294?autoplay=1" target="_blank" id="fancybox-video2" data-fancybox-type="iframe" class="fancybox.iframe" onclick="ga('send','event','played-video','clicked-play','button');">Watch the video</a>

不正确的代码:

<button type="submit" onclick="ga('send','event','Signed-Up','clicked-button','Free-Trial-14-Days');">Get Started</button>

+0

您能够发布(或PM我)与按钮的网站? – nyuen

回答

0

最可能发生的事情是<button>示例正在提交表单,该表单正在通知浏览器导航到新页面,因此现有页面正在卸载。通常,浏览器在页面开始卸载后将停止执行JavaScript,因此您的ga('send', ...)点击处理程序永远不会结束。

解决方法是拦截submit事件,进行ga('send', ...)调用,然后在发送呼叫的hitCallback中重新触发提交。

更新:当使用hitCallback作为表单提交等基本功能时,处理点击未能发送的情况很重要。你可以用这个setTimeout来完成,它的超时被调用成功的hitCallback清除。

0

正如菲利普提到的,您可能需要等待事件触发Google Analytics(如果您在Chrome网络标签中保留日志,则应该看到它失败)。作为使用hitCallback的替代方法(如果Google结束时出现错误/延迟,可能会导致链接失效)是使用setTimeout。

简单的jQuery例如

$(document).ready(function() { 

    // Note: be more specific! 
    $("button").each(function() { 
     var href = $(this).attr("href"); 
     var target = $(this).attr("target"); 

     $(this).click(function(e) { 
      e.preventDefault(); 
      ga('send','event','Signed-Up','clicked-button','Free-Trial-14-Days'); 
      setTimeout(function() { // Wait 300ms for tag to send to GA 
       window.open(href,(!target?"_self":target)); 
      },300); 
     }); 
    }); 

}); 
+0

使用'setTimeout'并不是一个非常可靠的解决方案,尽管@williamvicary确实提供了一个很好的观点,即您需要处理(尽管不太可能)情况,即失败。使用'setTimeout'和'hitCallback'的组合可以实现这一点。 –

相关问题