Question

我有一些用户可以发表评论的帖子，但有时当一篇文章中有超过5条评论，例如25条评论时，它会使我的页面非常沉重和长

这就是我的帖子评论系统的样子

Post 1
Comment for post 1 //if comments are more than 3 
<button class="view_comments" data-id="1">View previous comments</button>
it will show 2 comments by default and a button above this to fetch all comments of this post

Post 2
comment for post 2

现在，当我点击查看上一条评论时，它会抓取占据页面所有空格的所有评论

如何将这些额外的评论放入像facebook和linkedin这样的可滚动div中

这里是jquery部分

$(function() {
    $("body").on("click", ".view_comments", function() 
{

var ID = $(this).attr("id");

$.ajax({
type: "POST",
url: "https://www.example.com/ajax/viewajax.php",
data: "post_id="+ ID, 
cache: false,
success: function(html){
$("#view_comments"+ID).prepend(html);
$("#view"+ID).remove();
$("#two_comments"+ID).remove();
}
});

return false;
});
});

Answer 1

将CSS属性max-height设置为包含评论的容器<div>，至少应部分解决您的问题。

Answer 2

我认为这是一个CSS问题。

您可以创建一个div作为所有注释的占位符，并为其设置修复高度，例如300px。并设置overflow-x：隐藏在CSS中;

<div id="comment_placeholder" style="height: 300px; overflow-x: hidden;">
    <!-- append your comments here by jQuery -->
</div>

当评论很多时，如何使评论区域自动滚动

2 个答案: