单击使用JavaScript记录

gam*_*mue 6 javascript firefox jquery logging onclick

我想记录链接上的所有点击.

我写了一个小记录器,可以通过url调用(返回一个空页面).使用jquery-ajax方法调用此URL.但遗憾的是,如果用户使用firefox(IE中的一切看起来都很好),则不会记录每次点击.

我尝试了很多东西,但是没有解决这个问题的方法,有没有胶水?

HTML的代码:

<a href="http://google.com" onclick="return loggClick();">Click</a>
Run Code Online (Sandbox Code Playgroud)

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;
}
Run Code Online (Sandbox Code Playgroud)

编辑:我在示例中错过了我必须在js调用中传递动态参数,所以它"不可能"删除onclick事件:(

Ken*_*ric 4

我将开始摆脱内联“onclick”代码并稍后绑定事件:

  <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; 
  }); 
Run Code Online (Sandbox Code Playgroud)

另外,您可能会发生“竞争条件”。在我的示例中,我将async 设置为 false

这将在执行请求之前停止函数返回并跟踪链接。

关于异步

我在这里使用的原因async: false是因为默认情况下, aync 为 true,这意味着当浏览器看到return: true并导航离开页面时,AJAX 请求可能仅部分传输。

这就是我提到的“竞争条件”。在这里,这是一个廉价的技巧,可以通过使浏览器基本上停止直到请求完成,然后允许浏览器单击链接来避免这种情况。

更复杂的答案是让它返回“false”(这将终止浏览器本机的“跟随链接”行为),然后在函数中执行真正的complete重定向。

这并非没有其自身的问题,并且可能会导致请求完成时浏览行为缓慢,从而使用户有时间单击其他链接,而这些链接似乎什么也不做,然后最终一个请求在随机时间通过,并且看似随机发生重定向。

因此,高级解决方案包括阻止页面的其余部分并在请求完成时提供某种进度指示。

(因此,这个解决方案的复杂性比在一个简单的例子中更难实现一个数量级async: false