Question

我有以下锚点去目标网站并跟踪用户的统计信息：

<a href="http://target.tld" target="_blank" onclick="$('<img></img>').attr({src: 'stats.php?my_param=value'}); return true;">Foo</a>

<a href="http://target.tld" target="_self" onclick="$('<img></img>').attr({src: 'stats.php?my_param=value'}); return true;">Foo</a>

第一个为img（_blank）生成 200 Ok 的状态，但第二个（_self）的状态为（已取消）。

有人可以告诉我为什么，还有更好的方法吗？

谢谢！

Answer 1

首先，避免on*事件属性。如果你有jQuery，用它来绑定你的事件。其次，看起来您正在创建img元素，目标是发出跟踪点击的GET请求。相反，只需使用jQuery来触发请求。

<a href="http://target.tld" target="_blank" class="track-link" data-value="foo">Foo</a>    
<a href="http://target.tld" target="_self" class="track-link" data-value="bar">Foo</a>

$('.track-link').click(function() {
    var trackValue = $(this).data('value');
    $.get('/stats.php', { my_param: trackValue });
});

<强>更新

尝试使用mousedown事件确保在页面传输之前发送请求：

$('.track-link').mousedown(function() {
    var $link = $(this);

    if (!$link.data('request-sent')) {
        $.get(
            '/stats.php', 
            { my_param: $link.data('value') },
            function() {
                $link.data('request-sent', true);
            }
        );
    }
});

更新＃3

$('.track-link').click(function(e) {
    e.preventDefault();
    var $link = $(this);
    $.get(
        '/stats.php', 
        { my_param: $link.data('value') },
        function() {
            window.location.assign($link.prop('href'));
        }
    );
});

Anchor plus href和onclick事件（跟踪）

1 个答案: