如果在3秒内没有发生按键事件，JavaScript是否显示文本？

如果使用JavaScript在3秒内未按下任何键，如何显示文本？下面是我的代码，但它不工作

var response_handler = function (e) {

    var keyCode = e.keyCode,
    response;
    switch (keyCode) {
            case 39:
                response = 'right';
                break;
            default:
                response = '';
                break;
        };
    if (response.length > 0) {
    d3.select('#text').html('you pressed right arrow!');
    }else {
    setTimeout(function () {
    d3.select('#text').html('you didn't press any key!');
    }, 3000);
  };

}
$("body").focus().keydown(response_handler); 

---

你几乎把它做好了。：）

setTimeout

函数返回一个句柄，当您不再需要定时器时，可以使用该句柄来取消定时器

   var timer;

   var response_handler = function (e) {
          // for a better browser support
          var keyCode = e.keyCode || e.which;
          if (keyCode == 39) {
                d3.select('#text').html('you pressed right arrow!');
          }
          if (timer) {
                // cancel existing timer if exist;
                clearTimeout(timer);
          }
          // setup a new timer (to extend another 3 sec)
          timer = setTimeout(function () {
                 d3.select('#text').html('you didn't press any key!');
          }, 3000);
   }
   $("body").focus().keydown(response_handler); 

---

一旦你熟悉了基本原理，我建议你研究一下类似于

节流

和

去盎司

的概念，这可能适用于你想要实现的目标，还有许多实用程序库/函数可以将其简化为单个函数调用。

问题在于，您正在

keydown

事件中写入

setTimeout

。做这些

将

setTimeout

设置为全局，并在

DOMReady

处调用它

cancelTimeout

当按下任何键时

---

将超时设置为全局，并为超时设置一个单独的函数。这样，当按下一个键时，您可以重新启动超时，并且您的处理程序不会如此混乱。此外，您应该立即启动超时。使用

setTimeout（functionName）

使用单独的函数。