如何从javascript中的控制器获取键码？答案

【问题标题】：How to get the keycodes from the controller in javascript?如何从javascript中的控制器获取键码？
【发布时间】：2018-02-20 08:22:30
【问题描述】：

我确实买了一个便宜的控制器（windows 认为它是一个 xbox 360 控制器），我想从控制器中获取一些 javascript 按键事件。我确实尝试了一些在线密码测试器，例如http://keycode.info/，但他们没有回馈任何东西。我的问题是如何在 javascript 中从控制器获取键码。

【问题讨论】：

标签： javascript controller keycode xbox360

【解决方案1】：

游戏手柄的按键不由事件处理。这是一个对象的属性存储在：

navigator.getGamepads()[$1].buttons[$2].pressed;

$1 一个整数，从 0 到 3，因此您最多可以控制 4 个游戏手柄。
$2 一个整数，在我的例子中是从 0 到 16 ；

所以，我们必须自己检查。

navigator.getGamepads() 返回一个Gamepad List，如下所示：

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

如果连接了控制器，则如下所示：

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

第一个元素是一个Gamepad对象，它看起来像这样：

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

buttons List 中的元素是 GamepadButton 对象，看起来像这样：

{pressed: false, value: 0}

如果您使用的是 Google Chome，您可以通过在 dev-tools(Ctrl+Shift+i 打开它）在console中。

如果您手头有游戏手柄，您可以使用以下方法对其进行测试：

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);

【讨论】：

我只是尝试了但没有响应只有主页按钮返回“key: unidefined code:”

【解决方案3】：

基本的Events interface 不支持游戏手柄。但还有另一个 API：

这是一项实验性技术在生产中使用它之前，请仔细检查浏览器兼容性表。

HTML5 为丰富的交互式游戏开发引入了许多必要的组件。、WebGL、和等技术，以及 JavaScript 实现，已经成熟到现在可以支持许多以前需要本地代码的任务。 游戏手柄 API 是开发人员和设计人员访问和使用游戏手柄和其他游戏控制器的一种方式。

Gamepad API 在 Window 对象上引入了新事件，用于读取游戏手柄和控制器（以下简称为游戏手柄） 状态。除了这些事件之外，API 还添加了一个 Gamepad 对象，您可以使用它来查询已连接游戏手柄的状态，以及一个 navigator.getGamepads() 方法，您可以使用它来获取页面已知的游戏手柄列表。

Click here to find out more on MDN

【讨论】：

【解决方案4】：

我确实最终使用了一个名为 JoyToKey 的工具。

【讨论】：