如何使用Javascript跟踪出站点击 [英] How To Track Outbound Clicks Using Javascript
问题描述
我正在尝试使用此处提供的代码：进行ping到没有重定向的网址。 OP要求在不打开多个窗口的情况下ping一个url。我想这样做，但我想实际访问第二个网址，以便我可以跟踪服务器分析中的出站点击。
I am trying to use the code provided here: Make a ping to a url without redirecting. The OP has asked to ping a url without opening multiple windows. I would like to do this, but I want to actually visit a second url so I can track the outbound clicks in my server analytics.
以下是我正在尝试的代码工作：
Here's the code I'm trying to make work:
<a href="javascript:;" onclick="visitPageX()">link</a>
function visitPageX() {
// send Ajax request to the track URL
setTimeout(function() {
location.href = 'http://{pageXURL}';
}, 300);
}
然而，我不明白我应该把我的跟踪网址。这是我的尝试：
However, I don't understand where I should be putting my "tracking url". Here's my attempt at it:
<a href="javascript:;" onclick="visitPageX()"><a href="http://externalsite.com/">anchor text</a></a>
function visitPageX() {
// send Ajax request to the track URL
setTimeout(function() {
location.href = 'http://externalsite.com/';
}, 300);
}
我坚持要放在哪里
I'm stuck at where to put
http://examplemysite.com/tracking.php?123
，以便我可以计算出站点击次数。如果您可以帮助我使用此代码，或者提供更好的解决方案来跟踪外出点击而无需使用Google Analytics，我将不胜感激。
so that I can count the outbound clicks. I would appreciate it if you could help me get this code working or provide an even better solution to tracking outbound clicks without using Google Analytics.
非常感谢您的支持。
推荐答案
本示例使用jQuery以简化操作。它可以写成使用香草JavaScript。
This example uses jQuery for brevity. It could be written using vanilla javascript too.
在这里，我已经采取了跟踪网址并将其作为数据属性添加到锚标记，以便各种链接可以很容易地不同的追踪网址。我给锚定了一个trackme类，它是javascript知道如何将跟踪函数分配给特定的< a> 标记。
Here I've taken the tracking url and added it as a data attribute to the anchor tag so that various links can easily have different tracking urls. I've given the anchor a class of trackme which is how the javascript knows to assign the tracking function to that particular <a> tag.
javascript可防止加载href的默认设置，直到ajax调用成功或失败，然后它将加载href。
The javascript prevents the default of loading the href until the ajax call succeeds or fails, and then it will load the href.
<html>
<head>
<script src='https://code.jquery.com/jquery-3.2.1.js'></script>
<script type='text/javascript'>
$(document).on("click", ".trackme", function (e) {
e.preventDefault(); // stop browser from going to href right away
var finalURL = this.href;
$.ajax({
url: $(this).data("tracking-url"),
success: function () {
location.href = finalURL;
},
error: function () {
location.href = finalURL;
}
});
});
</script>
</head>
<body>
<a href="http://google.com" data-tracking-url="http://examplemysite.com/tracking.php?123" class="trackme">anchor text</a>
<a href="http://yahoo.com" data-tracking-url="http://examplemysite.com/tracking.php?124" class="trackme">anchor text</a>
</body>
</html>
这篇关于如何使用Javascript跟踪出站点击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
