多次setTimeOut导致延迟？

Question

我想知道重复使用多个 setTimeOut() 是否会导致延迟问题。

我的代码在这里：

setTimeout( function(){ $("#target").focus(); }, 50 );

每次单击按钮以重新关注#target 时，我都会调用此方法。但是前几次尝试（点击）工作得很好而且很快，之后，"focus action" 开始变慢。大约 30 次点击，执行 "focus action" 至少需要 3 秒，并不断增加延迟。

是浏览器造成的吗？感谢您的任何建议。

Answer 1

了解 JS 中的事件循环。也看这个视频。很有帮助。

https://www.youtube.com/watch?v=8aGhZQkoFbQ

希望对您有所帮助。

Answer 2

能否分享一个重现该行为的代码示例？

基本上在某些情况下，最佳做法可能是在另一个超时正在进行时取消之前的超时，或者在之前的请求完成之前不创建新的超时，

但是例如使用这个 fiddle 你可以看到它工作得很好，没有任何延迟，所以如果没有更多的代码就很难理解问题的根源。

function clickFocus(){
   setTimeout( function(){ $("#target").focus(); }, 50 );
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" onclick="clickFocus()">
focus
</button>
<input type="text" id="target" />

更好的做法是：

var awaitingFocus;
function clickFocus(){
  if(!awaitingFocus){
    awaitingFocus = setTimeout( function(){ 
      $("#target").focus();
      awaitingFocus = false;
    }, 50 );
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" onclick="clickFocus()">
focus
</button>
<input type="text" id="target" />

多次setTimeOut导致延迟？

Multiple setTimeOut lead to latency?

javascript

jquery

browser

settimeout

latency