手柄连接事件，实际测试发现是在第一次手柄按键时触发。

window.addEventListener("gamepadconnected", function(e) {
  var gp = navigator.getGamepads()[e.gamepad.index];
  console.log("Gamepad connected at index %d: %s. %d buttons, %d axes.",
  gp.index, gp.id,
  gp.buttons.length, gp.axes.length);
});

获取手柄对象，长度为4的数组，也就是最多支持4个手柄。

navigator.getGamepads();

手柄按键，不同手柄对应的按键下标可能不一样。以下以我的游戏手柄为例

var gp =  navigator.getGamepads()[0];
var axes0 = gp.axes[0];//方向摇杆-左右，连续 [-1, 1];
var axes1 =gp.axes[1];//方向摇杆-上下 ，连续[-1, 1];
var arrow = gp.axes[gp.axes.length-1];//十字方向键，从上(1)顺时针到左上(-1),八个方向，以1/7递增，离散;
if(gp.buttons[i].value>0){//按下为1，否则为0
//gp.buttons的键对应为['A', 'B', null, 'X', 'Y', null, 'L', 'R', 'ZL', 'ZR', '-', '+', null, null, null, 'Home']
}

手柄按键并不像网页一样有事件触发，你需要通过定时器获取gp,然后判断是否按下某键。

手柄按键测试 https://gamepad-tester.com/