2

我正在尝试为自己编写一个超级排序的 Javascript 库，只是为了让画布游戏更容易一些。

我想为来自 Javascript 的按键添加事件侦听器，而不是将其作为属性放入。

但每次我这样做时，它都无法正常工作，我真的很沮丧，浪费了我所有的备件，试图弄清楚我什么时候可以做功课！

无论如何，你认为有人能告诉我我哪里出错了吗？对于这段代码，我希望它alert()使用刚刚按下的箭头键

这是 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>

这是 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)
    }
}

所以我修复addEventListener了它，让它在点击事件时也能正常工作，但不是我keypress的。

这只是元素类型，就像它可以与画布或正文元素一起使用吗？如果它像一个图像或某种东西，是否必须集中注意力才能听到按键？

4

2 回答 2

3

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

您需要将其注册为

ide.addEventListener("keypress",keycheck);

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

于 2012-12-21T17:41:25.153 回答
1

@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 中的变量一样引用函数（这很棒）。

于 2012-12-21T17:44:52.993 回答