2010-01-16 44 views
1

我試過使用jQuery,但它不工作。使用Javascript和PHP跟蹤傳出鏈接

<script> 
    $("a").click(function() { 
     $.post("http://www.example.com/trackol.php", {result: "click" 
    }, "html"); 
    }); 
</script> 
<a href="http://www.google.com">out</a> 
+2

是onload事件之後運行的腳本? (或在dom被解析後?) 否則$(「a」)選擇器將不匹配以下鏈接! – 2010-01-16 15:31:43

回答

7

爲了獲得最佳效果,你應該改變兩件事在你的方法

  1. 使用onmousedown而不是click - 這樣你會得到一些額外的毫秒補償請注意跟蹤請求,否則瀏覽器可能根本無法啓動與您的跟蹤器的連接,因爲它已經離開原始頁面。缺點是你可能會得到一些誤報,因爲點擊用戶可能不會完成點擊(例如,保持鼠標按鈕不動,並將光標從鏈接上移開),但總體而言這是你應該願意做出的犧牲 - 考慮到更好的跟蹤質量。
  2. 使用圖像預取器(new Image().src='...')代替Ajax調用($.post('...'))。跟蹤器不是圖像的事實在這種情況下不相關,因爲您不想使用生成的「圖像」,您只是想向服務器發出請求。 Ajax調用是一種雙向連接,因此它需要更多時間,並且如果瀏覽器已經離開,但圖像預先獲取器只是將請求發送到服務器,則可能會失敗,並且返回或返回某些內容無關緊要不。

因此,解決辦法是這樣的:

<script> 
$(document).ready(function() { 
    $("a").mousedown(function(){ 
     new Image().src= "http://www.example.com/trackol.php?result=click"; 
    }); 
}); 
</script> 

<a href="http://www.google.com">out</a> 
2

而是使用JavaScript調用PHP跟蹤腳本的,你可以只鏈接到您的跟蹤腳本直接把它反過來重定向到最終目的地的響應,這樣的事情:

<a href="http://www.example.com/trackol.php?dest=http://www.google.com">out</a> 

和你做你跟蹤的東西在PHP腳本,後:

... 
header("Location: $dest"); 
+0

這是假設跟蹤腳本在您的服務器上,當然。 – Thilo 2010-01-16 15:40:51

+2

雖然這是一種可能性,但使用JS進行跟蹤可能會更好,因此搜索引擎會抓取正確的鏈接。您也可以使用PHP輸出正常鏈接,並使用JS自動爲它們加上前綴「http://www.example.com/trackol.php?dest ='。 – 2010-01-16 15:49:21

1

如前所述,問題是DOM加載之後你沒有運行該腳本。您可以通過包裝你的jQuery腳本里面$(function() { }解決這個問題,比如:

這工作:

<!doctype html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Tracking outgoing links with JavaScript and PHP</title> 
</head> 
<body> 
    <p><a href="http://www.google.com/">Test link to Google</a></p> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
    <script> 
    $(function() { 
    $('a').click(function() { 
    $.post('http://www.example.com/trackol.php', { result: 'click' }, 'html'); 
    }); 
    }); 
    </script> 
</body> 
</html> 

看到它在這裏的行動:http://jsbin.com/imomo3