区分按键和按键

Question

我有一个javascript函数，在按下'down'键时运行。我想，如果按下“向下”键，该功能根本不会运行。

我考虑过keydown和keyup之间的时间，如果时间小于1秒，那么函数将在keyup上运行。问题是，如果我按住键，浏览器会将其视为连续多次按下的键。

有更好的方法吗？

由于

Answer 1

有一个名为的键盘事件属性，如果按住该键，则返回true。

document.addEventListener('keydown', (event) => {
  if(event.repeat) {
    // key is being held down
  } else {
    // key is being pressed
  }
});

Answer 2

我刚刚编写了这个小脚本，用于区分按键和按键字段200毫秒。也许你可以使用它：

document.onkeydown = function(e){
    var keycode = window.event ? window.event.keyCode : e.which;
    if(keycode == 40){
        var timer = setTimeout(function(){
            alert('Down key held');
            document.onkeyup = function(){};
        }, 200); 
        document.onkeyup = function(){
            clearTimeout(timer);
            alert('Down key pressed');   
        }
    }
};

JSFiddle

Answer 3

如果我理解你的问题是你的浏览器将一个密钥解释为多个keydown事件。 如果按住键而不是简单地按下按键，你会想要发生不同的事情;并且你希望这种差异基于你认为应该构成“持有”密钥的某个时间。 因此，您需要通过跟踪keyup事件来区分保持和按下。以下伪代码将解决此问题：

On Keydown：

if !yourBool 
    start timer

yourBool = true 

on Keyup：

if timer < yourTime
    do something

yourBool = false

这将起作用，因为除非发生键盘事件，否则计时器不会重启。

现在......如果您的浏览器将密钥持有解释为：
Keydown，Keyup，Keydown，Keyup .......
那么你对这种方法有疑问。

Answer 4

也许你可以在keydown上触发一个计数器然后监听下一个keyup。一旦计数器超过五秒钟，或者您认为多长时间，您就可以启动该功能。有意义吗？

Answer 5

连续的keydowns不会激活密钥，因此可以区分它们。

http://jsfiddle.net/pimvdb/xMFGQ/

$('body').keydown(function() {
    if(!$(this).data('timeDown')) { // if not pressed yet, save time
        $(this).data('timeDown', +new Date);
    }
}).keyup(function() {
    var diff = new Date - $(this).data('timeDown'); // time difference
    if(diff < 1000) { // less than one second
        alert(123);
    }
    $(this).data('timeDown', null); // reset time
});

Answer 6

浏览器会多次按下该键，但keydown事件仅在第一次按下时发生。

你想要的是从keydown事件而不是keypressed计时。

Answer 7

我有类似的问题。我想抓住所有＆＃34;第一个＆＃34; keydown事件，但如果它们是按下键的结果，则忽略后续事件。不确定这是不是你想要的，但这是一种方法：

var repeat = false;
el.addEventListener("keyup", function() { repeat = false; });
el.addEventListener("keydown", function() {
  if (!repeat) {
    // Run your code.
    repeat = true;
  }
});