3

同様の投稿がたくさんありますが、私のニーズにぴったり合うものはありません。だから私は投稿を作成することを余儀なくされています。

名前のリストは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();
}
4

3 に答える 3

4

これを試して。

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の内容に関するものです。

于 2012-10-26T17:02:42.973 に答える
2

その代わり:

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(teste.php):

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

結果:

  • IE8:5004ミリ秒

  • Chorme:5005ミリ秒

  • Firefox:5014ミリ秒

  • IE7:5023ミリ秒

  • IE6:5053ミリ秒

テストの後、PHPでより正確に言うと、おそらくサーバー側の何かであると結論付けます。

于 2012-10-26T17:20:00.420 に答える
1

jqueryを使用する場合:

function showDetails(stop) {
  $('#info').load("showStopsInfoPopup.do?stop=" + stop);
}
于 2012-10-26T17:03:57.363 に答える