2

ユーザーからhtmlフォームを介して入力を受け取り、 XMLHttpRequestを使用してサーバー（ローカルで実行されている）から（xmlで）情報を取得する小さなコードを書いています。情報を取得したら、それを使用してリストに出力します。onreadystatechange用に作成したメソッド。ただし、リストがページに書き込まれると、ページが自動的に更新され、リストが表示されなくなります。なぜこれをしているのか、私は絶対に迷っていますか？！window.onbeforeunloadを使用してページの更新を強制的に停止し、更新を停止することができましたが、これを回避するためのより良い方法があり、何か間違ったことをしているに違いないと思います。私のコードは次のとおりです。

var xmlhttp=null;

関数byObserver（）{

var a = document.forms["byObserverForm"]["observerName"].value;
a = encodeURIComponent(a);

if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
}else{// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
if (xmlhttp) {
    xmlhttp.onreadystatechange = onReadyStateByObserver;
    xmlhttp.open("GET","http://localhost:8004/birdobs/observer/" + a, false);
    xmlhttp.send();   
} 
return false;

}

function onReadyStateByObserver(){

if (xmlhttp.readyState == 4){

    if (xmlhttp.status == 200){

        var xmlDoc = xmlhttp.responseXML;
        var observations = xmlDoc.getElementsByTagName("observation");

        if (observations.length != 0){

            // output into unordered list 
            var f = document.createDocumentFragment();
            var e = document.createElement("ul");
            f.appendChild(e);
            var ul = f.firstChild;

            for (i = 0; i<observations.length; i++) {
                var li = document.createElement("li");

                var te = document.createTextNode(observations[i].getAttribute("observer"));
                li.appendChild(te);
                ul.appendChild(li);
            }  // end for 
            document.getElementById("content").appendChild(f);

            window.onbeforeunload = function(){
                return "Refresh";
            }


        }
    }
} 
//have also tried return false here

}

私はこれを修正するために長い時間を費やしてきたので、どんな助けでも大歓迎です、事前に感謝します！（HTMLは必要ないと思ったので含めていませんが、役立つかどうか尋ねてください。投稿します！）最後に、これをChromeで実行していることを追加します。

4

3 に答える 3

2

これは、ブラウザがまだフォームを送信中であることが原因である可能性があります。デフォルトのフォーム送信処理が発生することを望まないことをブラウザーに通知する必要があります。

falseonsubmit メソッドから戻ると、これが行われます。

** アップデート **

ハンドラーを使用していてonsubmit、関数が呼び出されていると仮定してbyObserver、次のことを試してください。

<!-- HTML -->
<form ... onsubmit="return byObserver()">

// javascript
function byObserver() {
  ...
  return false;
}
于 2012-04-26T10:14:52.930 に答える
2

return falseフォームを送信するとき、たとえば送信時に呼び出される関数の最後で、デフォルトのイベントを停止する必要があります。イベントを停止していないため、ページが更新されている可能性があります（したがって、ブラウザはフォームの属性でsubmit指定されたページにリダイレクトされます）action

于 2012-04-26T10:13:09.397 に答える
1

フォームを送信することによって呼び出されるメソッドの最後に、return false;

起動されている関数のように見えるbyObserverので、次のようにします。

function byObserver(){
   [...]
   return false;
}
于 2012-04-26T10:13:51.017 に答える