我之前购买了一个廉价手柄(Windows系统认为它是Xbox 360手柄),我想从手柄中获取一些JavaScript按键事件。我尝试过一些在线按键测试器,例如http://keycode.info/,但它们没有返回任何内容。我的问题是如何在JavaScript中获取手柄的按键代码。
我之前购买了一个廉价手柄(Windows系统认为它是Xbox 360手柄),我想从手柄中获取一些JavaScript按键事件。我尝试过一些在线按键测试器,例如http://keycode.info/,但它们没有返回任何内容。我的问题是如何在JavaScript中获取手柄的按键代码。
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>
window.addEventListener("keydown", function(event) {
alert("key: " + event.key + ", code: " + event.code);
}, true);
基本的事件接口不支持游戏手柄。但是有另一个API可以实现:
这是一项实验性技术,请在生产环境中使用前仔细查看浏览器兼容性表。 HTML5引入了许多丰富、交互式游戏开发所需的组件。像我最终使用了一个叫做JoyToKey的工具。