如何获取按键按下时间以及按下的按键信息?

9

想象一下这段代码:

if (navigator.appName == "Opera")
    document.onkeypress = function (e) { console.log(e.keyCode); };
else 
    document.onkeydown = function (e) { console.log(e.keyCode); };

我想你的意思很明显。问题是,如果你长时间按住键,它会被注册多次。在我的应用程序中,这是一个问题,因为它让我的应用程序做了很多不必要的计算。有没有可能只获取一次 keypress,但同时获得按键按住的时间信息?


我对逻辑或其他方面并不是专家,但是if语句的分支不应该有所不同吗?:) - Šime Vidas
你使用类似jQuery的库吗? - Šime Vidas
哎呀,是的,你说得对,它们当然应该不同%) 不,我不使用jQuery或任何其他框架。 - Aleksejs Popovs
2个回答

13

这里是您需要的:

var pressed = {};

window.onkeydown = function(e) {
    if ( pressed[e.which] ) return;
    pressed[e.which] = e.timeStamp;
};

window.onkeyup = function(e) {
    if ( !pressed[e.which] ) return;
    var duration = ( e.timeStamp - pressed[e.which] ) / 1000;
    // Key "e.which" was pressed for "duration" seconds
    pressed[e.which] = 0;
};

实时演示: http://jsfiddle.net/EeXVX/1/show/

(删除URL中的“show /”部分以查看演示代码)

所以你有一个名为pressed的对象,它监视当前正在按下哪些键以及它们被按下的时间点。

在keyup处理程序内部,您确定按键是否被按下,如果是,则通过减去keyup / keydown事件的时间戳来计算持续时间。


请注意,这段代码在Opera和旧版本的IE(IE8及以下版本)中无法正常工作... - Šime Vidas

2

你尝试过像这样做吗:

  1. 在 onkeydown 事件中,移除 keydown 的监听器。
  2. 在 onkeyup 事件中,再次添加 keydown 监听器并计算时间?

当然,您还必须考虑其他可能性。比如说,如果onkeyup从未被触发,会怎样呢? - Amir Raminfar
这对于并行按键(同时按下多个键)是行不通的。 - Šime Vidas

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接