使用游戏手柄触发 jquery ajax mysql 插入

Question

我的这个小项目涉及注册与游戏板上按下的按钮相关的动作（记录为 PS3 风格）。因为 html5 支持游戏手柄，所以我决定使用它作为一种快速而简单的开发方式。

问题是，当运行ajax和调用php脚本时，按下按钮后，插入语句被重复。当我设置 async: false 并使用 Firefox 时不会发生这种情况，但这违背了 ajax 的目的，而且从我所读到的内容来看，这不是一件优雅的事情。

这就是我在 index.html 中的内容（从这里借用 https://gamedevelopment.tutsplus.com/tutorials/using-the-html5-gamepad-api-to-add-controller-support-to-browser-games--cms-21345）

function reportOnGamepad() {
    var gp = navigator.getGamepads()[0];
    var html = "";
        html += "id: "+gp.id+"<br/>";
        html += "timestamp: "+gp.timestamp+"<br/>";

    html += "<br/>move<br/>"

    if (gp.buttons[0].pressed) { var moves=" B1"; $.ajax({
                url:'my.php',
                method:'POST',
                data:{
                    moves: moves
                },
            }); html+= " <br/>";
};

还有我的my.php

$conn = new mysqli($servername, $username, $password, $dbname);
$moves = $_POST['moves'];
if ($conn->connect_error) {
 die("Connection failed: " . $conn->connect_error);
} 
$sql = "INSERT INTO test (moves) VALUES ('$moves')";
$conn->query($sql);
$conn->close();

如您所见，简单的东西。我对 jquery/javascript 的了解非常基础，所以如果有更多经验的人可以指出我做错了什么，我将不胜感激。谢谢。

Answer 1

您链接的 tuts+ 教程有一些代码可以为 Chrome 设置轮询间隔，以解决游戏手柄连接事件中的不可靠性问题：

//setup an interval for Chrome
var checkGP = window.setInterval(function() {
  console.log('checkGP');
  if(navigator.getGamepads()[0]) {
    if(!hasGP) $(window).trigger("gamepadconnected");
    window.clearInterval(checkGP);
  }
}, 500);

This bug 在最新版本的 Chrome 中已修复，解决方法可能会导致您的问题。例如，如果 checkGP 在收到 gamepadconnected 事件之前触发，您可以注册两次 reportOnGamepad 间隔。