javascript - 删除数据库中的上一行 单击按钮显示数据库中的下一行

Question

根据我已经做的事情，我需要这方面的帮助:在每次单击按钮时的输出中，它都会显示数据库中的行(评论)。但我希望如果我单击下一个按钮，它将显示数据库中的行(评论)，当我再次单击它时，它将删除数据库中的上一行(评论)并显示下一行(评论)。

这是代码:

<?php
    include 'dbh.php';

    $commentNewCount = $_POST['commentNewCount'];

    $sql = "SELECT * FROM comments LIMIT $commentNewCount";
    $result = mysqli_query($conn, $sql);
    if (mysqli_num_rows($result) > 0) {
        while ($row = mysqli_fetch_assoc($result)) {
            echo $row['id'];
        }
    } else {
        echo "There are number!";
    }
?>

这是按钮:

<script>
//jQuery code here!
$(document).ready(function() {
    var commentCount = 0;
    $("button").click(function() {
        commentCount = commentCount + 1;
        $("#comments").load("load-comments.php", {
            commentNewCount: commentCount
        });
    });
});
</script>

Answer 1

您在问题中标记了 AJAX，因此我假设您对这个术语有些熟悉。这确实可以通过 AJAX 来完成，但我在您的代码中没有看到任何 AJAX 尝试？

此外，当您说删除时，您是指字面意义上的具体删除，还是仅仅表示您的评论显示作为一种滑动功能，删除了显示上一条评论，显示队列中的下一条评论？在我的示例中，我将按照字面意思进行解释，因为这就是我必须真正假设的。

您可以做的是拥有一个文件来处理所有评论，并按照您喜欢的方式显示它们。例如，

<?php
$sql="SELECT * FROM comments ORDER BY id DESC";
$result_set=mysqli_query($conn, $sql);
while ($row=mysqli_fetch_assoc($result)) {
   /*
   html construction of displaying comments,
   echo'ing the row value that displays the comments.
   echo $row['comments']; as a guess
   */
}
?>

为了稍后引用，我们将该 PHP 文件命名为 comments.php。另请注意，我选择创建 ORDER BY按降序排列。假设您的评论 ID 是自动递增的，那么这将始终首先显示最新的评论，因为最高的 id 将是最新条目。

然后，在另一个文件 display-comments.php 中，您可以创建一个 document.ready 函数，将您的评论加载到元素 <div> 中。例如元素。

AJAX 函数可能如下所示:

$( document ).ready(function() {
    function loadCommentsAjax()
    {   
        $.ajax({
            type : "POST",
            url : "comments.php",
            data : { },
            success: function (html) {
              $("#commentContainer").html(html);                   
            }
        })
    }
});

我在这里所做的是将 AJAX 函数封装在 document.ready 中功能。它的作用是，当文档准备好时，它会触发 AJAX 函数。

AJAX 函数的工作原理是我们声明一个数据类型。最常见的可能是 POST和GET 。您可以查找不同的数据类型、如何处理它们以及它们的具体含义。 POST 之间的主要区别和GET例如，是 GET将其值显示为 URL 中的参数。由于我们没有解析任何数据，因此我们可以使用 GET没关系，因为它不会有任何影响。但是，如果您需要解析敏感数据，并且不希望用户与数据混合，那么您应该使用 POST .

然后我们告诉 AJAX 函数它应该使用哪个页面/文件。在我们的示例中，它将是我们之前创建的 comments.php。然后它会在 success 函数中将 html 内容粘贴到我们定义的容器中。在本例中，commentContainer。请注意，它是特定于id的定位，这意味着我们的容器元素需要具有该特定id。请注意，该容器位于我们的主文件 display-comments.php 文件中。

容器的示例如下:

<div id="commentContainer"></div>

这个 div 元素将包含我们在 comments.php 文件中创建的注释和 html 逻辑。

在您的按钮中，您可以使用另一个 AJAX 函数来处理评论删除，并在成功时调用我们的 loadCommentsAjax() 函数，以适当的方式重新加载我们的评论。

处理评论删除的 AJAX 函数将再次有一个执行删除操作的 PHP 文件。在我们的示例中，我们将其称为 delete-comments.php。

删除 AJAX 函数的示例:

function deleteNewestComment() {
    $.ajax({
        type : "POST",
        url : "delete-comments.php",
        data : { },
        success: function (html) {
          loadCommentsAjax();                   
        }
    })
}

我们的delete-comments.php看起来像这样:

<?php
/*
since you are deleting the latest entry each time, what we could do,
is make an SQL query that deletes the max id from the comments table
*/

$sql="DELETE FROM comments WHERE id=(SELECT max(id) FROM comments)";
$result=mysqli_query($conn, $sql);
?>

然后我们将让按钮调用删除函数，如下所示:

<button onclick="deleteNewestComment();">Delete latest comment</button>

让我知道这是否是您想要的，或者您是否真的只是想要一种滑动逻辑，您只需迭代您的评论，一次显示一个。

但如果您的意思确实是字面意思删除，那么将删除按钮链接到每个评论不是更好吗？这样您就可以单独、独立地删除它们？