按键事件 keyCode 适用于空格键,但不适用于字母 F

Keypress event keyCode works with spacebar, but not the letter F

提问人:Jeff 提问时间:2/28/2020 最后编辑:Jeff 更新时间:2/28/2020 访问量:188

问:

空格键工作正常,但我不明白为什么按字母不打印到?fconsole.log

<button type="button" id="keyboard">Keyboard</button>

<script>
    var kbd = document.getElementById( "keyboard" );

    kbd.focus();

    kbd.addEventListener( "keypress", function( event ) {
        if ( event.keyCode == 32 ) {
            if ( player.getPlayerState() == 1 ) {
                console.log('pressed spacebar 1');
                player.pauseVideo();
            }
            else {
                console.log('pressed spacebar 2');
                player.playVideo();
            }
        }
        if ( event.keyCode == 70 ) {
            console.log('pressed letter f');
        }
    });
</script>

编辑:

使用正确的 keyCode 是 .使用正确的 keyCode 是 .至少根据我的测试。空格键适用于其中任何一种。keypress102keydown7032

JavaScript的

评论

0赞 nima 2/28/2020
在 event.keyCode 中使用“if else”而不是“if”== 70
0赞 Michał Dąbrowski 2/28/2020
必须有一个错误会破坏代码,然后才能到达if(event.keyCode == 70)
0赞 RobG 2/28/2020
@novonimo——这不会有任何区别。
0赞 Jeff 2/28/2020
也许是因为我要将按键发送到 ?空格键对按钮有一些实用性,但字母没有......我被难住了。buttonf
0赞 Uthistran Selvaraj 2/28/2020
如果您有单独的键盘和笔记本电脑,则键码为 102

答:

1赞 vunski 2/28/2020 #1

不推荐使用按键。

将“keypress”更改为“keydown”。

带有“keypress”的键码 70 是大写的 F,您可以通过按住 shift 和 f 来确认这一点,而键码 102 是小写的 F。

你可以在这里阅读更多关于它的信息。

评论

0赞 Jeff 2/28/2020
嗯,这很有趣。有了它.有了它.keypress102keydown70
0赞 vunski 2/28/2020
我添加了一个解释。
0赞 Uthistran Selvaraj 2/28/2020 #2

F 是 102!。以下将起作用

<button type="button" id="keyboard">Keyboard</button>

<script>
var kbd = document.getElementById( "keyboard" );

kbd.focus();

kbd.addEventListener( "keypress", function( event ) {
    if ( event.keyCode == 32 ) {
        if ( player.getPlayerState() == 1 ) {
            console.log('pressed spacebar 1');
            player.pauseVideo();
        }
        else {
            console.log('pressed spacebar 2');
            player.playVideo();
        }
    }
    if ( event.keyCode == 102 ) {
        console.log('pressed letter f');
    }
});

添加了 JSFilldle