0

何千もの郵便番号を含むXMLファイルをメモリにロードするページがあります。xmlが読み込まれると、テキストボックスと検索ボタンが表示され、ユーザーは郵便番号（郵便番号）を入力して[検索]をクリックすると、いくつかの結果が表示されます。問題は、最初の読み込みに時間がかかり、テキストボックスと検索ボタンが表示される前にページに「読み込み中...」と10〜15秒間表示されることです。検索に余分な時間がかかる場合でも、検索ボックス/ボタンをより速く/すぐに表示する必要があります。確かに、私は.netの人であり、javascript/ajaxをよく知りません。これがxmlをロードする関数です。誰か助けてもらえますか？

function importXML() {

    var xmlhttp;
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    }
    else { // code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {

            var i,j;
            var xmlDoc=xmlhttp.responseXML;

            for (i=0; i<arrServiceProviders.length;i++) {
                var regionList = xmlDoc.getElementsByTagName("region");
                var postalCodeList = regionList[i].getElementsByTagName("postalcode");

                for (j=0;j<postalCodeList.length;j++) {

                    arrServiceProviders[i][j]=postalCodeList[j].childNodes[0].nodeValue;
                }
            // debug time:
            //alert(arrServiceProviders[i]);
            }
            var searchForm = document.getElementById("search-wrapper");
            var loadingPlaceholder = document.getElementById("loading");
            loadingPlaceholder.className = "hidden";
            searchForm.className = "";
        }
    };

    xmlhttp.open("GET","/agency-postal-codes.xml",true);
    xmlhttp.send();
}
4

1 に答える 1

0

セマフォ フラグを使用して、読み込み中にリクエストを追跡し、フォームをすぐに表示してから、セマフォのステータスを継続的にポーリングして、ajax リクエストが返されるまで検索の実行を停止できます。あまりエレガントではありませんが、その仕事をする必要があります。

例えば：

var  loaded = false;

function importXML() {

    var xmlhttp;
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    }
    else { // code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {

            var i,j;
            var xmlDoc=xmlhttp.responseXML;

            for (i=0; i<arrServiceProviders.length;i++) {
                var regionList = xmlDoc.getElementsByTagName("region");
                var postalCodeList = regionList[i].getElementsByTagName("postalcode");

                for (j=0;j<postalCodeList.length;j++) {

                    arrServiceProviders[i][j]=postalCodeList[j].childNodes[0].nodeValue;
                }
            // debug time:
            //alert(arrServiceProviders[i]);
            }
            loaded = true;
        }
    };

    xmlhttp.open("GET","/agency-postal-codes.xml",true);
    xmlhttp.send();
}

function doSearch() {
    console.log("about to search");
    var val = document.getElementById("txt").value;
    var res = document.getElementById("result");

    res.style.display = "block";
    if (loaded) {
        // search logic goes here
        res.innerHTML = "found";
    } else {
        res.innerHTML = "Still loading...";
        setTimeout(doSearch, 1000);
    }

}
于 2013-03-07T20:19:21.363 に答える