ajax在IE 8中速度很慢，但在Firefox和Chrome中速度很快

Question

有很多類似的帖子，但沒有什麼比較適合我的需求。所以我被迫創建一個帖子。

名稱列表顯示在jsp頁面上。當您將鼠標懸停在名稱上時，我會進行ajax調用，以在工具提示窗口中顯示該名稱的詳細信息。

用戶將使用IE8。在IE8中完成這個簡單的事情大概需要大約5秒鐘的時間，就像在Firefox和Chrome中它瞬間發生一樣。

我還注意到，隨着名稱顯示數量的增加或減少，響應時間也在IE8中也一樣。

如何在IE8中使其更快？

jsp頁面

<td onmouseover ="showDetails('${origin }')"> 
    <a href="#"><c:out value="${origin}"></c:out><span id="info"></span></a> 
</td> 

javascript函數

function showDetails(stop){ 
    var xmlHttpRequest; 
    if(window.XMLHttpRequest){ 
     xmlHttpRequest = new XMLHttpRequest(); 
    }else{ 
     xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlHttpRequest.onreadystatechange=function(){ 
     if(xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){ 
      document.getElementById("info").innerHTML = xmlHttpRequest.responseText; 
     } 
    } 
    xmlHttpRequest.open("GET", "showStopsInfoPopup.do?stop="+stop, true); 
    xmlHttpRequest.send(); 
} 

Answer 1

試試這個。

function showDetails(stop){ 
    var t1 = new Date().getTime(); 
    var xmlHttpRequest; 
    if(window.XMLHttpRequest){ 
     xmlHttpRequest = new XMLHttpRequest(); 
    }else{ 
     xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlHttpRequest.onreadystatechange=function(){ 
     if(xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){ 
      alert("Call took " + (new Date().getTime() - t1) + " milliseconds"); 
      document.getElementById("info").innerHTML = xmlHttpRequest.responseText; 
     } 
    } 
    xmlHttpRequest.open("GET", "showStopsInfoPopup.do?stop="+stop, true); 
    xmlHttpRequest.send(); 
} 

你可能會看到這個調用同樣快，但它的後續渲染反應在IE8中很慢。

如果您確認，那麼問題是關於responseText中的內容。

Answer 2

如果你想使用jquery：

function showDetails(stop) { 
    $('#info').load("showStopsInfoPopup.do?stop=" + stop); 
} 

Answer 3

相反：

xmlHttpRequest.onreadystatechange=function(){ 
    if(xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){ 
     alert("Call took " + new Date().getTime() - t1 + " milliseconds"); 
     document.getElementById("info").innerHTML = xmlHttpRequest.responseText; 
    } 
} 
xmlHttpRequest.open("GET", "showStopsInfoPopup.do?stop="+stop, true); 
xmlHttpRequest.send(); 

試試這個：

xmlHttpRequest.open("GET", "showStopsInfoPopup.do?stop="+stop, true); 
xmlHttpRequest.onreadystatechange=function(){ 
    if(xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){ 
     alert("Call took " + new Date().getTime() - t1 + " milliseconds"); 
     document.getElementById("info").innerHTML = xmlHttpRequest.responseText; 
    } 
} 
xmlHttpRequest.send(null); 

修復新日期

在你的代碼中缺少括號（記住分開Mathematics,Strings）。嘗試：

xmlHttpRequest.open("GET", "showStopsInfoPopup.do?stop="+stop, true); 
xmlHttpRequest.onreadystatechange=function(){ 
    if(xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){ 
     alert("Call took " + (new Date().getTime() - t1) + " milliseconds"); 
     document.getElementById("info").innerHTML = xmlHttpRequest.responseText; 
    } 
} 
xmlHttpRequest.send(null); 

---

測試 Ajax請求：

<div id="info"></div> 
<script>var xhr, t1; 
if(window.ActiveXObject){ 
    try { xhr=new ActiveXObject("Msxml2.XMLHTTP"); }catch(e){ 
     try { xhr=new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){} 
    } 
} else if(window.XMLHttpRequest){ 
    xhr=new XMLHttpRequest(); 
} 

xhr.open("GET", "teste.php", true); 

t1 = new Date().getTime();//I start the timer that point to prevent the previous functions affect the end result 

xhr.onreadystatechange=function(){ 
    if(xhr.readyState == 4 && xhr.status == 200){ 
     document.getElementById("info").innerHTML = "Call took " + (new Date().getTime() - t1) + " milliseconds"; 
    } 
} 
xhr.send(null); 
</script> 

PHP（泰斯特。PHP）：

<?php 
sleep(5); 
echo 'ok'; 
?> 

結果：

• IE8：5004毫秒

• Chorme：5005毫秒

• 火狐：5014毫秒

• IE7：5023毫秒

• IE6：5053毫秒

試驗後，得出結論認爲，或許還有對服務器端的側面，更確切地說在你的PHP。