点击使用JavaScript记录 [英] Click Logging with JavaScript
问题描述
我写了一个小记录器，可以通过url调用（返回一个空白页面）。这个URL用jquery-ajax方法调用。但不幸的是不是每一个点击都记录下来，如果用户使用Firefox（在IE中一切看起来不错）。
我已经尝试了很多东西，但没有解决这个问题，有谁有胶水？
HTML代码：
< a href =http://google.comonclick =return loggClick（）;>点击< / a>
JS-jQuery-Skript：
<$ p $ {
type：POST，
url：Logger.ff，//动态url to日志记录动作
数据：{
sid：'abc123'//随机数据
}，
contentType：application / x-www-form-urlencoded; charset = UTF-8 ，
cache：false
}）;
返回true;
编辑：我已经错过了例子，我必须通过动态参数在js调用中，所以不可能删除onclick事件：（
< a href => http://google.comrel =outbound>点击< / a>
$（a [rel = outbound]）。
var url = this.href;
$ .ajax（{
async：false，
type：POST，
url：Logger.ff， //动态url到日志记录动作
data：{
sid：'abc123'//随机数据
clicked：url
}，
contentType：application / x -www-form-urlencoded; charset = UTF-8，
cache：false
}）;
return true;
}）;
另外，y你可能会有比赛条件发生。在我的示例中，我将将async设置为false 。
这将停止在执行请求之前返回并跟随链接的函数。
关于异步
我使用 async：false 这里是因为在默认情况下，aync是真的，这意味着AJAX请求可能只有在浏览器看到 return：true 时才能被部分传输，并且离开该页面。
这就是我提到的竞争条件。在这里，它是一个便宜的伎俩，通过使浏览器基本上停止，直到请求完成，然后允许浏览器点击链接。
A更复杂的答案是让它返回false，（这会杀死浏览器原生的follow link行为），然后在中执行 real 重定向完成函数。
这不是没有它自己的问题，并且可能导致请求完成时浏览行为缓慢，从而允许用户点击其他链接，看起来什么都不做，然后最终一个请求通过随机时间，一个看似随机的重定向发生。
因此，先进的解决方案包括阻塞其余的页面，并在请求完成时给出某种进度指示。
（因此，这种解决方案的复杂性难以在简单比例 async：false ）
I want to log all clicks on a link.
I've written a little logger, which can be called by an url (returns an empty page). This url is called with a jquery-ajax-method. But unfortunately not every click is logged, if the user uses firefox (everything looks ok in IE).
I've tried many things but have no solution to this problem, have anybody a glue?
HTML-Code:
<a href="http://google.com" onclick="return loggClick();">Click</a>
JS-jQuery-Skript:
function loggClick(){
$.ajax({
type: "POST",
url: "Logger.ff", //dynamic url to logging action
data: {
sid: 'abc123' //random data
},
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
cache: false
});
return true;
}
EDIT: I've missed in the example that i have to pass dynamic parameters in the js-call, so it's "not possible" to remove the onclick-event :(
I would start getting rid of the inline 'onclick' code and binding the event later:
<a href="http://google.com" rel="outbound" >Click</a>
$("a[rel=outbound]").click(function(){
var url = this.href;
$.ajax({
async: false,
type: "POST",
url: "Logger.ff", //dynamic url to logging action
data: {
sid: 'abc123' //random data
clicked: url
},
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
cache: false
});
return true;
});
Also, you might have a "Race Condition" occurring. In my example I have set async to false.
This will stop the function returning and following the link before the request has been performed.
About Async
The reason I use async: false here is because with the default, aync is true, which means the AJAX request may only be partially transmitted by the time the browser sees return: true, and navigates away from the page.
This is that "race condition" I was mentioning. Here, its a cheap trick that avoids it by making the browser essentially come to a halt until the request is complete, and then allowing the browser to click the link.
A more sophisticated answer would be having it return "false", ( which will kill the browsers native "follow link" behaviour ), and then having the real redirection performed in the complete function.
This is not without its own issues mind, and could result in slow browsing behaviour while requests complete, allowing users time to click other links, which appear to do nothing, and then eventually one request gets through at a random time, and a seemingly random redirection occurs.
Hence, advanced solutions include blocking the rest of the page and giving some sort of progress indication while the request completes.
( And hence, the complexity of this solution is an order of magnitude harder to pull off in a simple example than async: false )
这篇关于点击使用JavaScript记录的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
