如何显示帖子供稿中最喜欢的帖子？

Question

我有一个简单的php脚本，用户可以在不登录的情况下进行发布，在他们提交帖子后，其帖子仅在帖子供稿中显示波纹，例如facebook的帖子/新闻供稿。现在，我该如何挑选三个最喜欢的帖子，并在另一个div部分中显示它们？那可能吗？

Index.php

<div class="comment-form-container">
            <form id="frm-comment">
                <div class="input-row">
                    <input type="hidden" name="comment_id" id="commentId"
                           placeholder="Name" /> <input class="input-field"
                           type="text" name="name" id="name" placeholder="Name" />
                </div>
                <div class="input-row">
                    <textarea class="input-field" type="text" name="comment"
                              id="comment" placeholder="Add a Comment">  </textarea>
                </div>
                <div>
                    <input type="button" class="btn-submit" id="submitButton"
                           value="Publish" /><div id="comment-message">Comments Added Successfully!</div>
                </div>

            </form>
        </div>
        <div id="output"></div>
        <script>
            var totalLikes = 0;
            var totalUnlikes = 0;

            function postReply(commentId) {
                $('#commentId').val(commentId);
                $("#name").focus();
            }

            $("#submitButton").click(function () {
                $("#comment-message").css('display', 'none');
                var str = $("#frm-comment").serialize();

                $.ajax({
                    url: "comment-add.php",
                    data: str,
                    type: 'post',
                    success: function (response)
                    {
                        var result = eval('(' + response + ')');
                        if (response)
                        {
                            $("#comment-message").css('display', 'inline-block');
                            $("#name").val("");
                            $("#comment").val("");
                            $("#commentId").val("");
                            listComment();
                        } else
                        {
                            alert("Failed to add comments !");
                            return false;
                        }
                    }
                });
            });

            $(document).ready(function () {
                listComment();
            });

            function listComment() {
                $.post("comment-list.php",
                        function (data) {
                            var data = JSON.parse(data);

                            var comments = "";
                            var replies = "";
                            var item = "";
                            var parent = -1;
                            var results = new Array();

                            var list = $("<ul class='outer-comment'>");
                            var item = $("<li>").html(comments);

                            for (var i = 0; (i < data.length); i++)
                            {
                                var commentId = data[i]['comment_id'];
                                parent = data[i]['parent_comment_id'];

                                var obj = getLikesUnlikes(commentId);

                                if (parent == "0")
                                {
                                    if(data[i]['like_unlike'] >= 1) 
                                    {
                                        like_icon = "<img src='like.png'  id='unlike_" + data[i]['comment_id'] + "' class='like-unlike'  onClick='likeOrDislike(" + data[i]['comment_id'] + ",-1)' />";
                                        like_icon += "<img style='display:none;' src='unlike.png' id='like_" + data[i]['comment_id'] + "' class='like-unlike' onClick='likeOrDislike(" + data[i]['comment_id'] + ",1)' />";
                                    }
                                    else
                                    {
                                           like_icon = "<img style='display:none;' src='like.png'  id='unlike_" + data[i]['comment_id'] + "' class='like-unlike'  onClick='likeOrDislike(" + data[i]['comment_id'] + ",-1)' />";
                                        like_icon += "<img src='unlike.png' id='like_" + data[i]['comment_id'] + "' class='like-unlike' onClick='likeOrDislike(" + data[i]['comment_id'] + ",1)' />";

                                    }

                                    comments = "\
                                        <div class='comment-row'>\
                                            <div class='comment-info'>\
                                                <span class='commet-row-label'>from</span>\
                                                <span class='posted-by'>" + data[i]['comment_sender_name'] + "</span>\
                                                <span class='commet-row-label'>at</span> \
                                                <span class='posted-at'>" + data[i]['date'] + "</span>\
                                            </div>\
                                            <div class='comment-text'>" + data[i]['comment'] + "</div>\
                                            <div>\
                                                <a class='btn-reply' onClick='postReply(" + commentId + ")'>Reply</a>\
                                            </div>\
                                            <div class='post-action'>\ " + like_icon + "&nbsp;\
                                                <span id='likes_" + commentId + "'> " + totalLikes + " likes </span>\
                                            </div>\
                                        </div>";

                                    var item = $("<li>").html(comments);
                                    list.append(item);
                                    var reply_list = $('<ul>');
                                    item.append(reply_list);
                                    listReplies(commentId, data, reply_list);
                                }
                            }
                            $("#output").html(list);
                        });
            }

            function listReplies(commentId, data, list) {

                for (var i = 0; (i < data.length); i++)
                {

                    var obj = getLikesUnlikes(data[i].comment_id);
                    if (commentId == data[i].parent_comment_id)
                    {
                        if(data[i]['like_unlike'] >= 1) 
                        {
                            like_icon = "<img src='like.png'  id='unlike_" + data[i]['comment_id'] + "' class='like-unlike'  onClick='likeOrDislike(" + data[i]['comment_id'] + ",-1)' />";
                            like_icon += "<img style='display:none;' src='unlike.png' id='like_" + data[i]['comment_id'] + "' class='like-unlike' onClick='likeOrDislike(" + data[i]['comment_id'] + ",1)' />";

                        }
                        else
                        {
                         like_icon = "<img style='display:none;' src='like.png'  id='unlike_" + data[i]['comment_id'] + "' class='like-unlike'  onClick='likeOrDislike(" + data[i]['comment_id'] + ",-1)' />";
                         like_icon += "<img src='unlike.png' id='like_" + data[i]['comment_id'] + "' class='like-unlike' onClick='likeOrDislike(" + data[i]['comment_id'] + ",1)' />";

                        }
                        var comments = "\
                                        <div class='comment-row'>\
                                            <div class='comment-info'>\
                                                <span class='commet-row-label'>from</span>\
                                                <span class='posted-by'>" + data[i]['comment_sender_name'] + "</span>\
                                                <span class='commet-row-label'>at</span> \
                                                <span class='posted-at'>" + data[i]['date'] + "</span>\
                                            </div>\
                                            <div class='comment-text'>" + data[i]['comment'] + "</div>\
                                            <div>\
                                                <a class='btn-reply' onClick='postReply(" + data[i]['comment_id'] + ")'>Reply</a>\
                                            </div>\
                                            <div class='post-action'> " + like_icon + "&nbsp;\
                                                <span id='likes_" + data[i]['comment_id'] + "'> " + totalLikes + " likes </span>\
                                            </div>\
                                        </div>";

                        var item = $("<li>").html(comments);
                        var reply_list = $('<ul>');
                        list.append(item);
                        item.append(reply_list);
                        listReplies(data[i].comment_id, data, reply_list);
                    }
                }
            }

            function getLikesUnlikes(commentId)
            {

                $.ajax({
                    type: 'POST',
                    async: false,
                    url: 'get-like-unlike.php',
                    data: {comment_id: commentId},
                    success: function (data)
                    {
                        totalLikes = data;
                    }

                });

            }


           function likeOrDislike(comment_id,like_unlike)
            {

                $.ajax({
                    url: 'comment-like-unlike.php',
                    async: false,
                    type: 'post',
                    data: {comment_id:comment_id,like_unlike:like_unlike},
                    dataType: 'json',
                    success: function (data) {

                        $("#likes_"+comment_id).text(data + " likes");

                        if (like_unlike == 1) { 
                            $("#like_" + comment_id).css("display", "none");
                            $("#unlike_" + comment_id).show();
                        }

                        if (like_unlike == -1) {
                            $("#unlike_" + comment_id).css("display", "none");
                            $("#like_" + comment_id).show();
                        }

                    },
                    error: function (data) {
                        alert("error : " + JSON.stringify(data));
                    }
                });
            }



        </script>

comment-add.php

    <?php
    require_once ("db.php");
    $commentId = isset($_POST['comment_id']) ? $_POST['comment_id'] : "";
    $comment = isset($_POST['comment']) ? $_POST['comment'] : "";
    $commentSenderName = isset($_POST['name']) ? $_POST['name'] : "";
    $date = date('Y-m-d H:i:s');

    $sql = "INSERT INTO tbl_comment(parent_comment_id,comment,comment_sender_name,date) VALUES ('" . $commentId . "','" . $comment . "','" . $commentSenderName . "','" . $date . "')";

    $result = mysqli_query($conn, $sql);

    if (! $result) {
        $result = mysqli_error($conn);
    }
    echo $result;
    ?>

comment-list.php

    <?php
require_once ("db.php");
$memberId = 1;
$sql = "SELECT tbl_comment.*,tbl_like_unlike.like_unlike FROM tbl_comment LEFT JOIN tbl_like_unlike ON tbl_comment.comment_id = tbl_like_unlike.comment_id AND member_id = " . $memberId . " ORDER BY tbl_like_unlike.like_unlike DESC, tbl_comment.date DESC";

$result = mysqli_query($conn, $sql);
$record_set = array();
while ($row = mysqli_fetch_assoc($result)) {
    array_push($record_set, $row);
}
mysqli_free_result($result);

mysqli_close($conn);
echo json_encode($record_set);
?>

因此，帖子被最喜欢的人显示，但我想选择排名前三的喜欢的帖子，并将它们显示在同一页面上的另一个div中。这是我必须在MySQL数据库中执行的操作，还是可以仅通过代码显示？任何帮助都将非常重要，我不知道如何执行此操作。而且我知道我的代码可用于SQL注入，但是在运行之前会对其进行修复。

我尝试过：

                            var top3 = data.slice(1, 3);
for (var t = 0; (t < top3.length); t++)
{
   var commentId = top3[t]['comment_id'];
   parent = data[i]['parent_comment_id'];

                                var obj = getLikesUnlikes(commentId);

                                if (parent == "0")
                                {
                                    if(data[i]['like_unlike'] >= 1) 
                                    {
                                        like_icon = "<img src='like.png'  id='unlike_" + data[i]['comment_id'] + "' class='like-unlike'  onClick='likeOrDislike(" + data[i]['comment_id'] + ",-1)' />";
                                        like_icon += "<img style='display:none;' src='https://i.imgur.com/TIma1lr.png' id='like_" + data[i]['comment_id'] + "' class='like-unlike' onClick='likeOrDislike(" + data[i]['comment_id'] + ",1)' />";
                                    }
                                    else
                                    {
                                           like_icon = "<img style='display:none;' src='like.png'  id='unlike_" + data[i]['comment_id'] + "' class='like-unlike'  onClick='likeOrDislike(" + data[i]['comment_id'] + ",-1)' />";
                                        like_icon += "<img src='https://i.imgur.com/TIma1lr.png' id='like_" + data[i]['comment_id'] + "' class='like-unlike' onClick='likeOrDislike(" + data[i]['comment_id'] + ",1)' />";

                                    }

                                    comments = "\
                                        <div class='comment-row'>\
                                                <div class='posted-at'><font color='white'>at</font>&nbsp;" + data[i]['date'] + "</div><br /><br />\
                                            <blockquote contenteditable='true'><div class='comment-text'><q>" + data[i]['comment'] + "</q></div>\
                                           <cite><font color='white'>from</font>&nbsp;" + data[i]['comment_sender_name'] + "</cite></blockquote>\
                                               <div class='line'><span><i class='fas fa-rupee-sign fa-2x'></i></span></div>\
                                         <a class='btn-reply')'><font color='white'>&nbsp;&nbsp;<i class='fas fa-flag'></i>&nbsp;&nbsp;Report</font></a><a class='btn-reply' onClick='postReply(" + commentId + ")'><font color='white'>&nbsp;&nbsp;&nbsp;<i class='fas fa-reply fa-rotate-180'></i>&nbsp;&nbsp;Reply</font></a>\
                                            <div class='post-action'>\ " + like_icon + "&nbsp;\
                                                <span id='likes_" + commentId + "'> " + totalLikes + " likes </span>\
                                            </div>\
                                        </div>";

                                    var item = $("<li>").html(comments);
                                    list.append(item);
                                    var reply_list = $('<ul>');
                                    item.append(reply_list);
                                    listReplies(commentId, data, reply_list);
}
   $("#output2").html(list);
                        });

Answer 1

在函数listComment（）中，您具有数据变量中的注释列表。您是说它已经按喜欢的次数排序了。因此，现在您需要获取数组的前三个（顶部）元素，并按自己的意愿打印，如下所示：

$（“＃output”）。html（list）; ....

之后

var top3 = data.slice(1, 3);
var list2 = $("<ul class='outer-comment'>");
for (var t = 0; (t < top3.length); t++)
{
   var commentId = top3[t]['comment_id'];
   var comment = top3[t];

   var out = '<li>Comment: ' + top3[t]['comment'] + '</li>';
   list2.append(out);

}
$("#output2").html(list2);