如何将键盘笔划分配给按钮？

Question

我有一个文本冒险游戏，用户需要输入命令才能继续游戏。 所以他们不必点击GO！ 按钮，我希望他们能够按回车键。

如何将 Enter 键分配给该按钮。

Answer 1

正如其他开发人员所指出的，您应该真正研究JavaScript 事件。

也就是说，这里是一个示例事件，它将侦听“Enter”keydown 事件的文档。

document.addEventListener("keydown", function (e) {
    e.preventDefault();
    if (e.key === "Enter") {
        console.log('You pressed enter.')
    }
});

Answer 2

您可以以编程方式触发元素上的点击事件。 在下面的代码片段示例中，我们向window对象添加了一个“ Keyup EventListener ”。 为了使输入被捕获，您需要首先单击代码段预览中的某个位置。 因为当您单击预览时，您将专注于预览文档。

 window.addEventListener('keyup', function(e) { if (e.which == 13) { e.preventDefault(); document.getElementById('go-button').click(); } })

 #scene { width: 500px; height: 300px; background-color: #999; display: flex; justify-content: center; align-items: center; } #go-button { cursor: pointer; outline: none; border: none; width: 100px; height: 100px; background-color: cornflowerblue; color: #eee; font-size: x-large; border-radius: 55%; } #go-button span{ font-size: small; } #go-button:hover { background-color: #729dee; }

 <div id="scene"> <button onclick="alert('Go clicked')" id="go-button" type="button"> Go! <br> <span> [Enter] </span> </button> </div>