如何避免JavaScript中自动重复的按键事件?
How can I avoid autorepeated keydown events in JavaScript?
如果用户按住该键,则触发多个keydown事件。出于可用性的原因,我需要使用keydown,而不是keyup,但我想避免这种情况。我的相关代码如下:
$(document).keydown(function(e) {
var key = 0;
if (e == null) { key = event.keyCode;}
else { key = e.which;}
switch(key) {
case config.keys.left:
goLeft();
break;
case config.keys.up:
goUp();
break;
case config.keys.right:
goRight();
break;
case config.keys.down:
goDown();
break;
case config.keys.action:
select();
break;
}
});
因此,当用户按下向下键时,例如,goDown()被触发多次。我希望它只触发一次,即使用户按住键
使用event.repeat
检测事件是否重复。然后,您可以等待"keyup",然后再允许处理程序执行第二次。
var allowed = true;
$(document).keydown(function(event) {
if (event.repeat != undefined) {
allowed = !event.repeat;
}
if (!allowed) return;
allowed = false;
//...
});
$(document).keyup(function(e) {
allowed = true;
});
$(document).focus(function(e) {
allowed = true;
});
另一个对接受的答案的简单调整,以允许多个键场景:
var keyAllowed = {};
$(document).keydown(function(e) {
if (keyAllowed [e.which] === false) return;
keyAllowed [e.which] = false;
// code to be executed goes here
});
$(document).keyup(function(e) {
keyAllowed [e.which] = true;
});
$(document).focus(function(e) {
keyAllowed = {};
});
它很简单
$(document).keydown(function(e) {
if (e.repeat) return;
// ...
});
所以,如果现有的解决方案看起来可疑(它不考虑同时按下2个或更多按钮的情况),我建议考虑另一个解决方案。
_prevKeyDown对象用于存储当前按下的键。 _prevKeyDown = {}
function _downKey( event )
{
var wh = event.which;
var kC = event.keyCode;
if( _prevKeyDown[ wh ] == null )
{
_prevKeyDown[ wh ] = {};
}
_prevKeyDown[ wh ][ kC ] = true;
};
function _upKey( event )
{
var wh = event.which;
var kC = event.keyCode;
if( _prevKeyDown[ wh ] != null )
{
_prevKeyDown[ wh ][ kC ] = null;
}
};
function _isKeyDown( event )
{
var wh = event.which;
var kC = event.keyCode;
var result = false;
if( this._prevKeyDown[ wh ] != null )
{
if( this._prevKeyDown[ wh ][ kC ] == true )
{
result = true;
}
}
return result;
}
// now your keydown/keyup handlers
function keydown( event )
{
if( !_isKeyDown( event ) )
{
// your once-keydown handler here
_downKey( event );
}
}
function keyup( event )
{
_upKey( event );
}
(抄自另一个问题,结果发现是这个问题的复制品)
dmaurolizer的KeyPress库提供了对所有键盘事件的精细控制。为事件提供回调函数。keydown
事件发送一个可选的isRepeat
参数,因此您可以忽略自动重复。以下是在电子游戏中使用推力控制功能的示例:
var my_combos = listener.register_many([
{
"keys" : "up",
"on_keydown" : function(e, num, isRepeat) {
if (isRepeat) return ;
thrust = 0.1;
},
"on_keyup" : function() {
thrust = 0;
}
}
]);
相关文章:
- 召回窗口加载事件 - javascript
- 动态创建OnClick事件Javascript
- 全局屏幕span onclick触发一个事件javascript
- 使用react js在跨域上执行事件javascript
- 在change事件javascript上动态添加行
- 在粘贴事件Javascript的输入字段中删除所有非数字字符
- 如何在多表单的输入框中使用输入事件javascript
- 无法查看特定信息.单击事件.Javascript
- 两个文本框事件Javascript
- 阻止鼠标滚轮滚动,但不阻止滚动条事件.JavaScript
- 从 onkeydown 事件 (Javascript) 获取当前用户输入
- “稍后提醒我”/“快速事件”JavaScript解决方案
- 更改我正在侦听的事件Javascript的对象的CSS
- setInterval 不允许同时单击事件 - javascript
- 对每种情况使用一个事件(JavaScript 开关)
- 仅创建第二次点击事件 Javascript
- 每 60 秒仅启动一次事件 (JavaScript)
- 如何连接来自不同文件的事件?Javascript/Backbone
- URL 更改事件 - JavaScript
- 无法在无头模式下使用 watir Webdriver 执行按钮元素的 onclick 事件 javascript