需求很簡單，點擊一個文件鏈接下載該文件，同時向后臺發送請求。需求很常見，用戶點擊下載后通常要進行下載量的統計，統計的話可以利用 script標簽 或者 img標簽（圖片ping） 的跨域能力，將它們的 src 屬性指向統計地址，但是這次用了 ajax 進行統計，遂出現了這個問題。

demo 代碼如下：

<a id="a" href="http://c758482.r82.cf2.rackcdn.com/Sublime Text 2.0.2 x64 Setup.exe" >click</a><script src="jQuery.js"></script><script>document.getElementById("a").onclick = function(e) {$.post("data.php");};</script>

我們都知道，如果一個 a 標簽同時擁有 onclick 事件和 href 屬性，onclick 事件的回調會在默認事件（即跳轉）之前執行，這也正是可以在 onclick 事件中用類似 e.preventDefault() 的代碼去除默認事件（即跳轉）的原因。所以以上代碼，如果點擊 a 標簽，首先會執行 onclick 事件的回調，即發送 ajax 請求，理論上，因為代碼中的 ajax 是異步的（其實同步也一樣），所以會一邊請求一邊打開下載文件。

chrome、UC、opera、2345瀏覽器中表現均和預期一致，firefox 下點擊能跳出下載文件，但是 ajax 部分報錯，IE 下未測試。

一開始的錯誤想法是，跨域導致報錯。當點擊下載鏈接時，ajax 請求會以為頁面即將跳到 href 所指的地址，導致瀏覽器以為該 ajax 跨域。該錯誤想法很快被推翻，一是因為先進行 ajax 請求，所以請求瞬間并未跨域；二是并未報跨域錯誤（通常如果是跨域錯誤控制臺會指出）；三是如下代碼更進一步證明了該錯誤。

<a id="a" href="http://c758482.r82.cf2.rackcdn.com/Sublime Text 2.0.2 x64 Setup.exe" >click</a><script src="jQuery.js"></script><script>$.post("data.php"); // data.php sleep(100)</script>

打開該頁面，隨即進行 ajax 請求，一旦點擊了下載按鈕，請求即被中止。如果 a 標簽的 href 屬性值不是文件地址，而是用任意的一個 url 替換，如果點擊 a 標簽，頁面會立即跳轉到該標簽所指向的地址，頁面都不存在了，ajax 自然也就中斷了。如果 a 標簽指向的是文件地址，在 ff 下是不是也會被一樣地解析呢（瀏覽器以為要跳到該地址了，而將 ajax 中止）？

答案是肯定的，我在 stackoverflow 中找到了答案。

When clicking the download link you are leaving the page, even it does not look so. If there would no file transfer, you would see the requested page.. try to set a target="_blank" or use an iframe as target for the link.

從提問可以看出，2010 年時 chrome 和 ff 都有類似的問題，而 chrome 或者說是 webkit 內核的瀏覽器在之后的版本迭代中修復了這個問題， ff 則一直將問題留到了現在（個人認為這不太合理）。