使用 Ajax 在 Div 单击上更新 MYSQL 表 - 没有页面刷新？

Question

我有一个名为用户的 MYSQL 表。我还有一个名为 online_status 的列。在我的页面上，我希望用户能够将他们的状态切换为“在线”或“离线”，并在他们使用 Ajax 单击 div 时在数据库中更新此状态，而无需刷新页面。这是我的 PHP/HTML 代码： <?php if ($profile['online_status'] == "Online") {             $status = "Offline";            }else{            $status = "Online";            } ?><div id="one"><li class="far fa-circle" onClick="UpdateRecord(<? echo $profile['online_status']; ?>);"/></li><? echo 'Show as ' .$status; ?></div>  我的阿贾克斯：<script type="text/javascript" src="/js/jquery.js"></script><script>  function UpdateRecord(id)  {      jQuery.ajax({       type: "POST",       url: "update_status.php",       data: 'id='+id,       cache: false,       success: function(response)       {         alert("Record successfully updated");       }     }); }</script>更新状态.php<?php$var = @$_POST['id'] ;$sql = "UPDATE users SET online_status = 'Offline' WHERE user_id = 1";$result = mysqli_query($conn,$sql) or die(mysqli_error($conn));//added for testingecho 'var = '.$var;?>我目前没有收到任何警报，我的数据库中也没有任何更新。请有人可以帮助我改进/修复代码以使其正常工作吗？此外，如果有一种方法可以消除对 update_status.php 文件的需求并拥有 ajax 自我发布，那么这将是首选。

Answer 1

据我所知，没有弹出警报也没有更新任何内容的原因是onclick()您拥有的按钮。将参数周围的引号添加到更新函数。正如您所拥有的，javascript 将参数视为一个 javascript 变量，就像$profile['online_status'];一个字符串。

如果您调试了代码，您应该会看到一条指向该行的onclick()错误

改变这个

onClick="UpdateRecord(<? echo $profile['online_status']; ?>);"

到

onClick="UpdateRecord('<? echo $profile['online_status']; ?>');"

此外，您还在更新语句中对 where 子句进行硬编码。您应该$_POST['id']通过准备好的语句使用变量

Answer 2

将数据传递到 PHP 文件

data: { id: id },

将数据库连接添加到您的 PHP 文件

<?php

 $var = $_POST['id'] ;

 $sql = "UPDATE users SET online_status = 'Offline' WHERE user_id = '$var'";

 $result = mysqli_query($conn,$sql) or die(mysqli_error($conn));

?>

如果您仍然看到任何错误，然后按F12并转到网络选项卡，然后单击该 div，网络选项卡将记录您的 ajax 文件返回，您可以通过选择您的 php 文件的响应来检查那里，希望它有帮助