fiddle

Question

所以我有一些代码用于即时搜索：

$(function() {
var timer;
$("#searchterm").on('keypress',function() {
    timer && clearTimeout(timer);
    timer = setTimeout(doStuff, 800);
    timer = setTimeout(more, 3600);
});
});

基本上，会发生的事情是代码检测到用户何时停止输入并触发doStuff函数，该函数会加载显示结果的所有ajax。 more函数应该检测用户何时滚动到结果的末尾，并使用ajax函数加载下一个批处理，但如果用户键入请求，则暂停并输入更多内容，就像页面一样加载，它似乎导致more函数不止一次触发，当用户滚动到结果的末尾时，导致下一个结果加载两次，有时甚至更多，这使得页面冻结和生成一个非常长的结果列表。我试过了在more函数加载之前延长延迟，但这并不能完全解决问题。

有什么建议吗？

Answer 1

您是否需要为计时器创建更多变量？现在，您似乎将more的计时器分配给与doStuff的计时器相同的变量，因此它会覆盖doStuff的计时器。

可能是这样的：

$(function() {
    var doStuffTimer, moreTimer;

    $("#searchterm").on('keypress',function() {
        doStuffTimer && clearTimeout(doStuffTimer);
        doStuffTimer = setTimeout(doStuff, 800);

        moreTimer && clearTimeout(moreTimer);
        moreTimer = setTimeout(more, 3600);
    });
});

Answer 2

我认为您的问题是由于您没有正确清除timer这一事实造成的。我会做这样的事情：

fiddle

<强> HTML

<div>
    <input id="stop">
</div>

<强> JS

var timer;

$("#stop").keyup(function(){
    $("div").css("background-color", "white");
    clearTimeout(timer);
    timer = setTimeout(more, 2500);
}).keyup();

var more = function(){
    $("div").css("background-color", "red");
}

这会清除最初设置的timer计时器。如果您想对页面进行调整，那么当您滚动到页面底部时，可以执行timer = setTimeout(#dosomething, timeHere)调用。然后，您需要一个事件处理程序，在用户开始输入时清除并重置计时器。

如何防止Javascript中的其他功能加载

2 个答案:

fiddle