javascript - window.setInterval 在这里使用正确还是我引入了麻烦？

Question

我有一个来自第三方的搜索输入.searchinp，但我无法修改。但我想将结果从页面左侧移动到右侧。我目前使用 setInterval 来执行此操作。我使用这个 setInterval 的原因是我想要移动的 div 在加载时不存在于页面上。因此我不能简单地移动它。

在创建结果 div.dropdown-menu 之前，用户需要填写至少 3 个字母。

为了让它动起来，我用了这个:

      window.setInterval(function(){
        /// call your function here
        $('.dropdown-menu').contents().appendTo('.knowledgebase-related-questions');
      }, 100);

这可行，但我想知道这样做是否有缺点？例如网站速度、缓慢或其他缺点。

Answer 1

如果是我，我会向用户正在输入的输入添加一个监听器，并设置一个延迟，以便在用户停止输入 X 秒后调用我的函数。像这样的事情:

var keyupDelay = (function(){
  var timer = 0;
  return function(callback, ms){
    clearTimeout (timer);
    timer = setTimeout(callback, ms);
  };
})(); 


var inputSelector = '#some-id'; // adjust as needed 

$(inputSelector ).keyup(function() {
    keyupDelay(function(){
      // append or replace your html as needed
    }, 2500 ); // this will trigger 2.5 seconds after typing stops, adjust as needed
});