javascript - Ajax jquery mysqli 更新

Question

我正在尝试做一个 Ajax 演示来自学这个概念，但我就是做不到。

我要获取的示例是在第一页上取一个变量(在本例中为绿色)，如果单击了绿色按钮，则在 ajax 处理页面上使用它以某种方式记录绿色单击按钮(当前在错误日志中，然后我将继续将其存储在数据库中)。

理想情况下，我希望能够重复使用相同的代码段将变量更改为红色，并让错误日志报告按下了红色按钮。

我已经使用 location.reload 和随机数向自己证明了 javascript 正在执行，并且页面在每次加载时都不同。

我根本不是 JavaScript 专家，您可能看得出来。我需要先声明 a 变量还是完全声明其他变量？

uglytest.php

<script src="https://code.jquery.com/jquery-2.2.3.js"></script>
<!-- jQuery Ajax -->
<script type="text/javascript">
function clickyes(a) {
$.ajax({
       type: "POST",
       url: "./ajax.php",
       data: {"test":a},
       success: function (response) {
       default = $("#default").val();
       });
    location.reload();
}
</script>

<script type="text/javascript">
function clickno() {
    location.reload();
}
</script>


<?
echo mt_rand(0,99);
$result = "green"; 

echo "<p><form>here's a $result button. Do you want click on it?</p>";
echo "<button onclick=\"clickyes(" . $result . ")\" style=\"background-color: $result; \">Yes</button>";
echo "<button onclick=\"clickno()\">No</button></form>";

?>

ajax.php

<?
  $test = $_POST['test'];
   error_log($test, 0);
?>

Answer 1

此处 location.reload 将在不等待 ajax 请求的情况下被调用，因为 ajax 是一个异步函数。这可能是问题所在。在ajax响应成功时保持reload。

function clickyes(a) {
$.ajax({
       type: "POST",
       url: "./ajax.php",
       data: {"test":a},
       success: function (response) {
       default = $("#default").val();
       location.reload();
       });

}


Also Change this: 
echo "<button onclick=\"clickyes('" . $result . "')\" style=\"background-color: $result; \">Yes</button>";