当keyup事件(对于另一个键)被触发时,keydown(重复)中断 [英] keydown (repetition) breaks when keyup event (for ANOTHER key) is fired

查看:1939
本文介绍了当keyup事件(对于另一个键)被触发时,keydown(重复)中断的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是一个奇怪的一个,所以我想我是缺少一些明显的东西,或者这是这些事件在浏览器中如何实现的缺陷。



首先总结一下这个问题,然后再提供一个孤立的案例 -



箭头键用于移动播放器(作为handleKeyDown函数是在任何时间点击任何地方在页面上点击)。同样地,当一个键被释放时,另一个函数被触发(handleKeyUp)。



当你(播放器)按住左键时,handleKeyDown函数被重复触发诚然,我认为蔑视你所期望的和这个名字的含义,但是,尽管如此,这是所有浏览器的正常行为,我确信你知道)。



所以这是发生了什么:玩家持有朝这个方向走的方向;他们然后按数字键(热键项目),因为他们继续沿着方向向下走。这里发生的是,当您释放热键项目的数字键时,播放器移动的重复将停止!



我写了一个非常小的孤立示例的这种行为:

 < html> 
< head>
< script type ='text / javascript'src ='jquery-1.5.1.min.js'>< / script>
< script type ='text / javascript'>
var log = {};
var keyState = {};
var keyCount = {'down':0,'up':0};
window.addEventListener('keydown',handleKeyDown,false);
window.addEventListener('keyup',handleKeyUp,false);
函数handleKeyDown(e)
{
keyState [e.keyCode] = true;
keyCount.down ++;
log.prepend([+ e.keyCode +]);
返回false;
}
函数handleKeyUp(e)
{
keyState [e.keyCode] = false;
keyCount.down ++;
返回true;
}
$(function(){log = $('#log');});
< / script>
< / head>
< body>
< div id ='debug'>< / div>
< div id ='log'>< / div>
< / body>



你也可以尝试一下:



http://sikosoft.net/keys.html



按页面上的任意键,您将看到keyCode出现在页面上。当您按住键时,键码会一再重复。



当初始键仍然保持时,按住其他键时,行为会变得古怪。在释放最近的密钥后,重复从第一个密钥停止。有趣的是,如果您尝试示例并按住一个键,然后按住第二个键,而不是释放第二个键,则释放第一个键:第二个键继续重复。



所以,当keyup事件被触发时,似乎终止了在早期的key被触发的keydown事件的重复。



我尝试过各种各样的事情,从事件处理函数中返回false,返回true,尝试按键而不是keydown,保存键状态,如果按钮的keystate仍然为真,继续移动,但是它们都是如此就是当keyup被触发时,任何积极传播的keydown事件都被杀死。我已阅读 JavaScript疯狂:键盘事件,我没有看到任何关于这种特定类型行为。



这是一个设计缺陷与关键事件的实现,还是我缺少一些东西?我在Chrome,IE&



任何建议或输入?

解决方案

方式操作系统/环境工作,结果是浏览器的工作方式。



键盘重复不应该继续点击从另一个键浏览器,因为它没有其他地方的行为。打开记事本,或vim或pico,或您使用的任何文本编辑器,并执行相同的事件序列。你会看到,在按键后,您按下的第一个键不继续打印新的字母。这就是这些东西在操作系统中设计的方式,结果就是他们通过编辑器和浏览器等传播的方式。


This is a bit of a weird one so I figure I'm either missing something obvious or this is a flaw with how these events are implemented in browsers.

Let me first summarize an example scenario this issue comes up with before providing an isolated case-example;

The arrow keys are used to move the player (as a handleKeyDown function is fired anytime a key is hit anywhere on the page). Likewise, anytime a key is released another function is fired (handleKeyUp).

As you (the player) hold the left key down, the handleKeyDown function is repeatedly triggered (which admittedly I think defies what you'd expect and what the name implies, but nonetheless, this is normal behavior across all browsers as I'm sure you know).

So here's what happens: the player holds a direction to walk in that direction; they then press a number key (for hot-keyed item) AS they continue to walk while holding the direction down. What happens here is that as you release the number key for the hot-keyed item, the repetition for player movement just stops!

I've written a very small isolated example of this behavior:

<html>
<head>
    <script type='text/javascript' src='jquery-1.5.1.min.js'></script>
    <script type='text/javascript'>
        var log = {};
        var keyState = {};
        var keyCount = {'down': 0, 'up': 0};
        window.addEventListener('keydown', handleKeyDown, false);
        window.addEventListener('keyup', handleKeyUp, false);
        function handleKeyDown (e)
            {
            keyState[e.keyCode] = true;
            keyCount.down++;
            log.prepend(" ["+e.keyCode+"] ");
            return false;
            }
        function handleKeyUp (e)
            {
            keyState[e.keyCode] = false;
            keyCount.down++;
            return true;
            }
        $(function(){log = $('#log');});
    </script>
</head>
<body>
    <div id='debug'></div>
    <div id='log'></div>
</body>

You can also try it here:

http://sikosoft.net/keys.html

Press any keys on the page and you will see the keyCode appear on the page. As you hold down the key, the keycode repeats over and over.

The behavior gets quirky when press down a different key while the initial key is still being held. Upon release of that recent key, the repetition stops from the first key. Interestingly, if you try the example and hold down one key, and then hold a second key, but instead of releasing the second, release the first: the second key DOES continue to repeat.

So what seems to go on is that when the keyup event is fired, it seems to terminate repetition in keydown events that were fired on an earlier key.

I've tried all sorts of things ranging from using returning false in both event-handling functions, returning true, trying keypress instead of keydown, saving key-states and continuing movement if the button's keystate is still true, but what it all comes down to is that when keyup is fired any actively propagating keydown events are killed. I've read through JavaScript Madness: Keyboard Events and I am not seeing anything about this specific sort of behavior.

Is this a design flaw with the implementation of key-events, or am I missing something? I observe this same behavior in Chrome, IE & Firefox.

Any advice or input?

解决方案

That is the way the OS/environment works, and as a result that is the way the browser works.

The keydown repetition shouldn't continue firing after the keyup from another key in the browser, since it doesn't behave that way anywhere else. Open Notepad, or vim, or pico, or whatever text editor you use, and perform the same sequence of events. You'll see that after the keyup, the first key you pressed does not keep printing new letters. That's just the way these things were designed in the OS, and as a result that's the way they're propogated through to the editors and browsers etc.

这篇关于当keyup事件(对于另一个键)被触发时,keydown(重复)中断的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆