0

我的网站上有一个 ajax 搜索功能，效果很好！但是，我看到由于快速的打字机，它可能会导致未使用的 httpResquests。所以我想添加一个计时器来减慢搜索速度。

首先想到的是 setTimeout，但它不起作用。它似乎第一次起作用（暂停搜索），但在显示结果后，它只是有点恢复正常显示结果，第二次我的键是。因此，在我注意到无论出于何种原因它都不起作用之后，我转向 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 回答