1

次のようなテーブルへのphpクエリを介してサーバーに非同期的に接続するjs関数を作成しました。

function grabber(url, element)
{
    async = new XMLHttpRequest();
    async.onreadystatechange=function()
    {
        if (async.readyState==4 && async.status==200)
        {
            document.getElementById(element).innerHTML=async.responseText;
        }
    }
    async.open("GET", url, true);
    async.send();
}

次に、要素のイベント ハンドラーが起動されたときに、この関数を異なるパラメーターで 2 回呼び出して、現在空の 2 つの要素の 2 つのデータ ストリームをフェッチする別の関数があります。私を混乱させているのは、両方が同時に機能しないことです。関数内の唯一のメソッドである場合は両方とも機能しますが、両方を一緒に使用すると、一方のみが機能します。順番は関係ありません。

$('.box').keyup(function() {
    grabber("herp.php?q=" + $(this).val(), "rice");
    //grabber("derp.php?q=" + $(this).val(), "gohan");
});

derp は位置に関係なく優先されるようで、herp は derp がコメントアウトされている場合にのみ機能します。php ファイルは通常の html 要素のみを出力し、個別に正常に動作します。これらを同時に機能させる方法についてのアイデアはありますか?

4

2 に答える 2

2

ローカル変数を作成する必要がある場合、グローバル変数を作成しています。

async = new XMLHttpRequest(); // creates this.async, which probably means
                              // window.async

これには、grabberが複数回呼び出されると、各呼び出しが の以前の値をasync新しい要求で上書きするという効果があります。これは、各コールバックが最終的に実行されるときに、 -- の最後の値の結果を使用していることを意味します。asyncこれにより、すべてのターゲット要素が同じ を取得しinnerHtmlます。

この問題を解決するにvarは、前に次を追加します。

var async = new XMLHttpRequest();
于 2012-06-30T16:45:07.460 に答える
1

「async」変数を次のように宣言するのを忘れましたvar:

var async = new XMLHttpRequest();

キーワードがなければvar、それはグローバル変数です。したがって、連続する呼び出しは、前の呼び出しが行ったことを上書きします。

于 2012-06-30T16:45:13.667 に答える