0

私のサイトには、うまく機能する ajax 検索機能があります。ただし、高速なタイパーが原因で、未使用の httpResquests が発生する可能性があることがわかりました。そこで、タイマーを追加して検索を遅くしたいと思います。

最初に頭に浮かんだのは setTimeout でしたが、機能していません。最初は機能しているように見えますが（検索を一時停止します）、結果が表示された後、キーが2番目に上がると通常の結果表示に戻ります。なんらかの理由で機能していないことに気付いた後、stackoverflowに目を向けてこれとこれを見つけましたが、基本的には私がしたこととまったく同じです。

私はそれがAJAXの非同期の方法と関係があるかもしれないと考えています.おそらく時間が実際に切れる前にsetTimeoutでメソッドが呼び出されますが、それはあまり意味がありません. したがって、正直に言うと、何が起こっているのかわかりません。洞察をいただければ幸いです。ああ、私は独自の API を使用しています。メソッド名をちらりと見ただけで、それらが何をするかを正確に知ることができると確信しています。

function validateNetworkInput()
{
    var query, timer = null;

    query = getValue("searchNetworkInput");

    if(query.length > 0)
    {
        clearTimeout(timer);
        show("searchNetworkWrapper");       
        timer = setTimeout(function(){searchNetworks(query);}, 3000);
    }
    else
    {
        clearTimeout(timer);
        hide("searchNetworkWrapper");
    }
}

...

function searchNetworks(query)
{
    var ajaxObject, params, path;

    ajaxObject = getAjaxObject();
    params = "?q=" + query;
    path = getInternalPath() + "searchNetworks" + params;

    ajaxObject.open("GET", path, true);
    ajaxObject.send();

    ajaxObject.onreadystatechange = function()
    {
        if(ajaxObject.readyState == 4 && ajaxObject.status == 200)
        {
            setInnerHtml("searchNetworkWrapper", ajaxObject.responseText);
        }
        else if (ajaxObject.readyState == 4 && ajaxObject.status != 200)
        {
            getErrorReport("Error Searching Networks", "search our database for the network you are looking for");
        }
    };
}
4

1 に答える 1

1

あなたの問題はtimer、関数にローカルであるため、次に呼び出されたときに古いタイマーを覚えていないことです。関数呼び出し間で保持される変数が必要です。このようなものが動作するはずです：

var validateNetworkInput = (function() {
  var timer;
  return function() {
    var query = getValue("searchNetworkInput");

    clearTimeout(timer);
    if(query.length > 0) {
        show("searchNetworkWrapper");       
        timer = setTimeout(function(){searchNetworks(query);}, 3000);
    } else {
        hide("searchNetworkWrapper");
    }
})();
于 2013-04-11T23:54:27.780 に答える