如何在JavaScript中获取控制器的按键代码?

4

我之前购买了一个廉价手柄(Windows系统认为它是Xbox 360手柄),我想从手柄中获取一些JavaScript按键事件。我尝试过一些在线按键测试器,例如http://keycode.info/,但它们没有返回任何内容。我的问题是如何在JavaScript中获取手柄的按键代码。

4个回答

5
游戏手柄按键不是通过事件处理的,而是存储在对象属性中:
navigator.getGamepads()[$1].buttons[$2].pressed; 

$1 是一个整数,范围从0到3,这意味着您可以最多使用4个游戏手柄进行控制。
$2 是一个整数,在我的情况下范围为0到16;

因此,我们必须自行检查它。

navigator.getGamepads() 返回一个游戏手柄列表,它看起来像这样:

{0: null, 1: null, 2: null, 3: null, length: 4}

如果控制器已连接,它的外观如下:

{0: Gamepad, 1: null, 2: null, 3: null, length: 4}

第一个元素是一个游戏手柄对象,它长这样:

{
    axes: [0, 0, 0, 0], //these are directions keys;
    buttons: [GamepadButton, GamepadButton, ...] //these are buttons;
    connected: true, 
    id: "ACGAM R1", 
    index: 0,
}

按钮列表中的元素是游戏手柄按钮对象,它长这样:

{pressed: false, value: 0}

如果您正在使用 Google Chrome,您可以通过在 dev-tools 中键入 navigator.getGamepads()Ctrl+Shift+i 打开它)来检查所有这些信息。

if you have a gamepad in hand, you can test it use this:

function gameLoop() {
    var gamepad = navigator.getGamepads()[0]; //get the first controller.
    if (gamepad && gamepad.connected) {
        //check if direction buttons (UP, DOWN, LEFT, RIGHT) was pressed
 var axes = gamepad.axes;
 for (var i in axes) {
     if (axes[i] != 0) { print('axes[%s] value is: %s', i, axes[i]); };
 };
 // to check if other buttons(A,B,C,D,OK,Exit...) was pressed
 var buttons = gamepad.buttons;
 for (var i in buttons) {
     if (buttons[i].pressed == true) { print("buttons[%s] pressed", i); };
 };
    };
};

var game_loop ;

//when controller connected, page will show: "Gamepad connected"
window.addEventListener("gamepadconnected", function(e) {
    print("Gamepad %s connected at %d", e.gamepad.id, e.gamepad.index);
    game_loop = setInterval(gameLoop, 50);  //check if a button was pressed 20 times every second.
});

//when controller disconnected, page will show: "Gamepad disconnected"
window.addEventListener("gamepaddisconnected", function(e) {
    print("Gamepad %s disconnected", e.gamepad.id);
    clearInterval(game_loop);  // stop checking

});
//end of the code.

//nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn
// not about control keys
function print() {
    var args = ['== no string == ',];
    for (var i in arguments) { args[i] = arguments[i]; };
    var s = args[0], vs = args.slice(1);
    for (var i in vs) { s = s.replace(/%[a-z]/, vs[i]); };
    document.body.innerHTML = s ;
};
<html>
<title> test Gamepad buttons</title>
<body>
no Gamepad deteced!
</body>
</html>


2
你尝试过吗?
window.addEventListener("keydown", function(event) {
  alert("key: " + event.key + ", code: " + event.code);
}, true);

2
我刚刚尝试了一下,但没有响应,只有主页按钮返回了“键:未定义 代码:”。 - Dennis

1

基本的事件接口不支持游戏手柄。但是有另一个API可以实现:

这是一项实验性技术,请在生产环境中使用前仔细查看浏览器兼容性表。 HTML5引入了许多丰富、交互式游戏开发所需的组件。像、WebGL、

0

我最终使用了一个叫做JoyToKey的工具。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接