Javascript 仅当内容在500毫秒内未更改时才执行操作

目前我有

$('document').ready(function(){
  $('input').keyUp(function(){
    $('#output').text($(this).text());
  });
});

我想做的是

注册按键时，等待500毫秒， 如果在500毫秒内再次按下某个键， 等一下，离按键500毫秒

一旦500毫秒过去， 运行

$（'#output'）.text（$（this.text（））

如何管理超时？
您可以设置并清除计时器，如下所示：

$(function(){
  $('input').keyup(function(){
    clearTimeout($.data(this, 'timer'));
    var input = this;
    $.data(this, 'timer', setTimeout(function() {
      $('#output').text($(input).text());
    }, 500));
  });
});

这是在
keyup
上执行的，它在运行
$（“#输出”）.text（$（input）.text（））
之前设置500毫秒的延迟，如果在此之前按下另一个键，它将取消计时器并启动另一个…因此它将在500毫秒空闲之前不会运行。此外，通过使用将计时器存储在特定元素上，此通用解决方案适用于页面上任意数量的元素


另外，你的
$（'document'）.ready（）
应该是
$（document）。ready（）
或者更短的
$（function（）{
，就像我上面提到的，
“document”
（引号中）不必要地运行选择器。
为尼克欢呼，还有一个问题。从功能上讲，$（document.ready（）{}和$（function（）{}）之间有区别吗；@Hailwood-不，这只是一条捷径：）