点击登录使用JavaScript

Question

我要登录的链接上的所有点击。

我写了一个小记录仪，它可以通过一个URL（返回一个空页）被调用。这个网址是带一个jQuery的Ajax的方法。但不幸的是不是每个点击登录，如果用户使用火狐（一切正常的IE浏览器）。

我尝试过很多事情，但都没有解决这个问题，有任何胶水？

HTML码：

<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;
}

编辑：我已经错过了，我必须通过在JS-呼叫动态参数的例子中，所以它是“不可能的”去掉的onclick事件：（

Answer 1

我将开始的摆脱内联的 '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; 
  }); 

同时，你可能有一个 “竞争条件” 出现的。在我的例子我有设置异步到假即可。

此将停止函数返回与已经执行请求之前以下的链接。

关于异步

我在这里使用async: false的原因是因为与默认，aync是true，这意味着AJAX请求只能由浏览器看到return: true时被部分地透射，并从页面导航离开。

这是“竞争条件”我被提。在这里，它是通过使浏览器避免了它一个把戏基本停顿，直到请求完成，然后允许浏览器点击链接。

一个更复杂的答案是让它返回“假”，（这会杀死浏览器原生“跟随链接”行为），然后具有的真正的重定向在complete功能进行。

这是不是没有自己的问题的头脑，并可能导致慢的浏览行为，同时要求完成，让用户一次点击其他链接，这似乎什么都不做，然后最后一个请求在随机时间获得通过，并发生看似随机的重定向。

因此，先进的解决方案包括阻止页面的其余部分，并给予某种进展指示而请求完成。

（并且因此，该解决方案的复杂性是幅度较硬的顺序在一个简单的例子比async: false拉断）

Answer 2

我认为FF是给你不好的结果的原因是因为你要离开该页面的操作需要一定的时间来执行之前。因为如果你使用你的外部链接的目标mhartman的链接提到它应该工作的罚款。如果你不能做到这一点，那么你可能要等待日志来完成，虽然你可能会看到导航延迟。

HTML代码

<a href="http://google.com" onclick="return loggClick(event);">Click</a>

的

function loggClick(e) {
  if (!e) e = window.event;

  e.preventDefault();  // cancels the link

  var theLink = this.href;  // stores the link for later

  $.ajax({
     async: false,
     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,
         complete: function() {
           // navigate when the log completes
           this.location.href = theLink;
         }
    });
    return true;
  }
}

Answer 3

这是你可能没有想到的第二多个服务器端的方法是有一个处理您的重定向并记录数据，那么一个页面。

例如：

<a href="LoggerRedirect.ff?url=http://google.com">Click</a>

Answer 4

在上面的海报是正确的，它是不可靠的，因为你要离开该页面有机会登录之前。

您可以这样做：

1）返回false，所以href是不活跃。 2）记录点击 3）使用location.href重定向到它会被重定向到URL

您可能会看到一个轻微的延迟，如果它需要很长的时间内为您onclick处理程序来执行。

Answer 5

被处理链接的点击之前这个例子将激发关闭一个ajax交。我发现我不得不打电话同步AJAX或POST将不会被执行。在这个例子中我阿贾克斯后是其附加日志文件PHP页面。这个例子是有效的，因为它只是一个附加click事件到窗口。它也不会与一个用户点击一个链接干扰。

//attach click event to window
attachClickEvent = function() {
    $(document).on('click', function(e) { //document for IE8 compatibility
        var element = $(e.target);
        var tag = element.prop('tagName');

        if (tag === 'A') {
            var data = {'title':document.title, 'URL':element.attr('href'), 'origin':location.href};
            logData(data);
        }
    });
}

logData = function(data) {
    $.ajax({
        async: false,
        cache: false,
        type: "POST",
        data: data,
        url: 'logger.php',
        success: function(msg) { 
            //debugging
        },
        error: function() {
            //debugging
        }
    });
}