Firefox a.click不會在沒有斷點的情況下觸發

Question

我正在開發一個項目，我們有一個AJAX調用，它會響應一個包含excel文件的blob。我希望代碼在獲得響應時以打開文件的形式下載。這裏是回調：

var blob = new Blob([response.data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"}); 
var objectUrl = URL.createObjectURL(blob); 
var a = document.createElement("a"); 
var header = response.headers("Content-Disposition"); 
a.download = header.substring(header.indexOf("filename=") + "filename=".length); 
a.href = objectUrl; 
document.body.appendChild(a); 
console.debug("Clicking a tag"); 
a.click(); 
document.body.removeChild(a); 
window.URL.revokeObjectURL(objectUrl); 

這段代碼在Chrome中工作正常，但在firefox中，a.click（）觸發時沒有任何反應。調試語句打印，所以我知道回調正在發生。另外，由於某種原因，如果我在a.click()上放置了一個斷點，它可以很好地工作。

有人可以解釋爲什麼點擊只能在調試模式下工作嗎？

Answer 1

Firefox有一些保護措施或只是奇怪的行爲圍繞這樣的事情。我不知道推導，但收益返回給瀏覽器了一會兒，通常在做前點擊清除它：

// ... 
a.href = objectUrl; 
document.body.appendChild(a); 
setTimeout(function() { 
    a.click(); 
    document.body.removeChild(a); 
    window.URL.revokeObjectURL(objectUrl); 
}, 0); 
// ... 

注意，代碼繼setTimeout將之前運行的setTimeout的內容呢。

你甚至可能需要兩個：

// ... 
a.href = objectUrl; 
document.body.appendChild(a); 
setTimeout(function() { 
    a.click(); 
    setTimeout(function() { 
     document.body.removeChild(a); 
     window.URL.revokeObjectURL(objectUrl); 
    }, 0); 
}, 0); 
// ...