Question

好吧所以我试着为自己写一个超级排序的javascript库，只是为了让画布游戏稍微容易一些

并且我想从javascript为keypresses添加事件监听器，而不是将其作为属性放入

但是每次我都这样做它从来没有正常工作，我真的很沮丧，浪费我所有的备件，试图在我做功课时弄清楚它！

无论如何，你认为有人可以告诉我哪里出错了吗？对于这个代码id，就像它的alert（）用刚按下了哪个箭头键

Heres index.html

<html>
<head>
<script src="spencersjslibrary.js"></script>
</head>
<body>
<div id="blueblock" style="background:blue; width:100px; height:100px;"></div>
<script>addkeylisten("blueblock")</script>
</body>
</html>

heres spencersjslibrary.js

//Keyboard stuff for moving and yeah

//Adding event listener
function addkeylisten(ida) {
    alert(ida)
    var ide = document.getElementById(ida)
    ide.addEventListener("keypress", keycheck(event))
}


//checking what key was pressed and assign string value to "lastkey"
function keycheck(event) {
    var bttn = (event.keyCode);
    switch (bttn) {
        case 38:
            lastkey = "up";
            break;
        case 40:
            lastkey = "down";
            break;
        case 37:
            lastkey = "left";
            break;
        case 39:
            lastkey = "right";
            alert(lastkey)
    }
}

k sweet所以我修复了addEventListener并且使用click事件使其工作得很好但不是我的按键事件，

只是元素类型，就像它使用canvas或body元素一样吗？如果它像一个图像或某种东西那么它必须是焦点才能听到按键吗？

Answer 1

语法ide.addEventListener("keypress",keycheck(event))不正确。

您需要将其注册为

ide.addEventListener（ “按键”，键校验）;

您的代码实际上是调用处理程序而不是仅仅注册函数指针。

Answer 2

@ closure的回答是正确的。

ide.addEventListener("keypress", keycheck(event))将始终立即执行keycheck(event) 。这很糟糕，因为event未定义，并且您的处理程序不会在keypress上调用。

您正在寻找的是：

ide.addEventListener("keypress", function (event) {
    keycheck(event)); // binds to the input ^
});

这可以简化为：

ide.addEventListener("keypress", keycheck);

因为你实际上可以在JavaScript中引用像变量这样的函数（很棒）。

添加事件监听器javascript的麻烦

2 个答案: