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。