我正在尝试使用Google Analytics跟踪提交按钮。但问题是提交太快,因此GA不跟踪事件。
如何正确地完成这项工作?我正在使用JSF 2.
$("#frmButtons\\:btnExportWord").click(function () {
_gaq.push(['_trackEvent', 'Decode', 'Decode copying', 'Export to Word']);
});
我尝试了GA的 hitcallback 功能但没有成功。我认为这个功能没有太多记录。
修改:
我意识到 hitcallback 功能不是我需要的,一旦按钮发送文件到用户下载,所以,不要发生导航。
答案 0 :(得分:1)
您可以挂钩表单的提交侦听器,阻止默认提交事件,触发Google Analytics代码,然后手动提交表单,如下所示:
$('#formID').submit(function(e){
var self = this;
e.preventDefault(); // Prevent Default Submit Event
_gaq.push(['_trackEvent', 'Decode', 'Decode copying', 'Export to Word']);
self.submit(); // Manually Trigger Submit
});
这是一个JSFiddle Example。
我希望这有帮助!
<强>更新强>
如果您的表单有多个按钮而您只想跟踪特定的按钮,请考虑将类应用到您想要跟踪的按钮上,然后在执行提交时检查它,如下所示:
HTML:
<form id="theForm" action="#" method="post">
<input type="text" />
<input type="submit" value="Track Submit" class="track" />
<input type="submit" value="Submit" />
</form>
JS:
// Identify Clicked Submit Button
$('#theForm input[type=submit]').on('click', function(){
// Reset Previous Data
$('#theForm input[type=submit]').data('clicked', 'false');
// Set Button as Clicked
$(this).data('clicked', 'true');
});
// Hook into Form Submit
$('#theForm').submit(function(e){
var self = this;
// Prevent Default Submit
e.preventDefault();
// Track ONLY if Clicked Button has Class of 'track'
$('input[type=submit]', this).each(function(){
if ($(this).data('clicked') == 'true' && $(this).hasClass('track') === true){
alert('TRACK DATA');
}
});
// Manually Submit Form
self.submit();
});
更新了小提琴here。
答案 1 :(得分:1)
通常,在填充_gaq
数组并将信标发送给Google之前,页面可以更改。要解决此问题,您还可以考虑使用JavaScript超时,如下例所示:
setTimeout(function() {
// track now after 1000 ms
_gaq.push();
}, 1000);
答案 2 :(得分:0)
合并@dSquared和@crmpicco之前的答案我把这项工作用这个:
$("#frmButtons\\:btnExportWord").click(function (e) {
//track the event
_gaq.push(['_trackEvent', 'Decode', 'Decode copying', 'Export to Word']);
var button = $(this);
//create a delay and call the same click
if (button.data('tracked') != 'true') {
e.preventDefault(); //consume event if not tracked yet
setTimeout( function(){
button.data('tracked', 'true');
button.click(); //call again the submit
}, 300);//enough time to track the event
} else {
//reset the flag
button.data('tracked', 'false');
//let form being submited once the event is already tracked
}
});
我真的不喜欢这个解决方案,一旦我需要消耗这个事件,然后再递归地回忆它,但我不是JS专家,我还没有找到适用于任何浏览器的其他解决方案。 JSF生成了一些代码,再次调用事件是在服务器端获取它的简单方法。
谢谢大家的帮助!