jQuery：使用PHP进行点击跟踪
是的，我了解Google Analytics。我们将其用于我们的整体网站指标，并且我知道我们可以跟踪各个链接。然而，我们需要非常具体的链接跟踪解决方案，我们需要能够实时跟踪数据提供给我们的web应用程序，所以我写了我自己的解决方案：jQuery：使用PHP进行点击跟踪
的jQuery：
$.fn.track = function() {
var source, url, name, ref, $this;
$this = $(this);
if (window.location.search.substring(1) != '') {
source = window.location.pathname + "?" + window.location.search.substring(1);
} else {
source = window.location.pathname;
}
url = jQuery.URLEncode($this.attr('href'));
name = $this.attr('name');
ref = jQuery.URLEncode(source);
$this.live('click', function (click) {
click.preventDefault();
$.post('/lib/track.php', {
url: url,
name: name,
ref: ref
}, function() { window.location = $this.attr('href'); });
});
};
.. 。使用jQuery URLEncode插件（http://www.digitalbart.com/jquery-and-urlencode/）。
现在，这段代码可以在我的PHP后端和我的机器上正常工作，但它似乎并不适用于其他人。有时通过jQuery传入的参数不会被传入，导致数据库中没有记录，其中没有name，url或ref。
对于我的生活，我无法弄清楚为什么会发生这种情况;我知道$.post是触发的，因为数据库中有记录（在PHP中，我还记录了请求的IP以及时间戳），但是在很多情况下，PHP脚本正在从jQuery接收空白$_POST变量。
我已经在我的工作场所所有浏览器上测试过它，并且它们都适合我;然而，创建的所有记录（不是我的计算机）中约75％都是空白的（大多数记录使用的都是我使用的浏览器）。
为什么会发生这种情况？
我认为，最后，我的问题最终是由于jQuery解析请求的时间太长，而且我非常坚持不想让链接“依赖于”javascript（要么没有它就不能工作，要么用户不得不等待跟踪请求在他们到达新页面之前完成）。
浏览许多其他解决方案的在线之后 - 一些借款和其他人的启发 - 我来到位于本地JavaScript下面的解决方案：
if (document.getElementsByClassName === undefined) { // get elements by class name, adjusted for IE's incompetence
document.getElementsByClassName = function(className) {
var hasClassName, allElements, results, element;
hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)");
allElements = document.getElementsByTagName("*");
results = [];
for (var i = 0; (element = allElements[i]) !== null; i++) {
var elementClass = element.className;
if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass)) {
results.push(element);
}
}
return results;
};
}
function addTracker(obj, type, fn) { // adds a tracker to the page, like $('xxx').event
if (obj.addEventListener) {
obj.addEventListener(type, fn, false);
} else if (obj.addEventListener) {
obj['e' + type + fn] = fn;
obj[type + fn] = function() {
obj['e' + type + fn](window.event);
};
obj.attachEvent('on' + type, obj[type + fn]);
}
}
function save_click(passed_object) { // this function records a click
var now, then, path, encoded, to, from, name, img;
now = new Date();
path = '/lib/click.php';
from = (window.decode) ? window.decodeURI(document.URL) : document.URL;
to = (window.decodeURI) ? window.decodeURI(passed_object.href) : passed_object.href;
name = (passed_object.name && passed_object.name != '') ? passed_object.name : '[No Name]';
// timestamp the path!
path += '?timestamp=' + now.getTime();
path += '&to=' + escape(to) + '&from=' + escape(from) + '&name=' + name; // compile the path with the recorded information
img = new Image();
img.src = path; // when we call the image, we poll the php page; genius!
while (now.getTime() < then) {
now = new Date(); // resets the timer for subsequent clicks
}
}
function get_targeted_links(target) { // finds targeted elements and wires them up with an event handler
var links, link;
if (document.getElementsByClassName) {
links = document.getElementsByClassName(target);
for (var i = 0; i < links.length; i++) {
link = links[i];
if (link.href) {
addTracker(links[i], 'mousedown', save_click(links[i]));
}
}
}
}
addTracker(window, 'load', get_targeted_links('trackit'));
...这似乎是比迅捷得多我上面写过的jQuery插件，到目前为止已经足够快，可以跟踪我所投的所有请求。
希望能帮助别人！
我喜欢这个解决方案。干得好！ :-) – Flukey 2010-03-30 15:16:53
这些“点击”可能来自机器人，或JS禁用的人。如果你点击的链接必须被追踪，为什么你不考虑只有JS链接，即。把网址放在与href不同的attr中，然后使用你的点击处理程序来处理它，在你的track.php中添加引用检查
你还检查过，如果所有的元素都是链接？
是的，我只测试一个元素到目前为止，它是一个具有所有适当属性的链接。由于要访问这个链接必须登录到网站，我不认为它可能是机器人;我承认我很难相信我们75％的用户在浏览sans Javascript。不知道我明白你的意思是只有JS的链接，但是......请你解释一下吗？ – neezer 2009-12-11 17:23:31
显然，你已经投入了一些时间在此解决方案，但以防万一;你见过Mixpanel吗？撇开成本，它确实是你似乎试图做的...... – Mathew 2009-12-11 18:09:26