多级评论

最新推荐文章于 2022-06-26 16:04:16 发布
最新推荐文章于 2022-06-26 16:04:16 发布
阅读量147 收藏
点赞数
文章标签： 数据库 python javascript ViewUI
原文链接：http://www.cnblogs.com/sss4/p/7501978.html
版权 
# data=[
#     [11,22,33],
#     [44,55,66]
# ]
# data[0].append(data[1])
# print(data)
# data[1].append(77)
#
# 由于[11, 22, 33, [44, 55, 66, 77]]和[[11, 22, 33, [44, 55, 66, 77]], [44, 55, 66, 77]]
#
# 引用的是同一块内存地址，所以谁添加了内容对应的也跟随添加


# data=[
#       {'k1':'v1'},
#       {'k2':'v2'}
#       ]
#
# for item in data:
#     item['kk']='vv'
#
#
# # python里面列表和字典引用的是引用类型，当我们拿到地址被操作了，会发生级联变化；如果想要再独立一份就需要copy（）
#
# msg_list = [
#    {'id':1,'content':'xxx','parent_id':None},
#    {'id':2,'content':'xxx','parent_id':None},
#    {'id':3,'content':'xxx','parent_id':None},
#    {'id':4,'content':'xxx','parent_id':1},
#    {'id':5,'content':'xxx','parent_id':4},
#    {'id':6,'content':'xxx','parent_id':2},
#    {'id':7,'content':'xxx','parent_id':5},
#    {'id':8,'content':'xxx','parent_id':3},
# ]
# # v=[row.setdefault('child')  for row in msg_list]
# #
# # #注意列表生成公式里面 不能出现=等赋值操作，可以使用方法
# # print(msg_list)
#
# #方式2
#
# msg_list_dict={}
# # msg_list_dict={
# # 1, {'id':1,'content':'xxx','parent_id':None},
# # 2, {'id':2,'content':'xxx','parent_id':None},
# #               }
# #字典的在存储的时候，键会转换成一个hashs值，这个hash值和内存地址相关，# 无论字典里的键值对有多大，都可以一次的寻找到key对应的value
# #字典查询就是数据库里的hansh 索引，直接拿到key就可以快得惊人的获取到value
# #无需向列表那样 查询 是 一个个顺序 遍历
#
# #所以定义一个字典 方便我们查找 评论信息，而且因为Python是数据引用类型，相同数据引用一块内存，也不会占用内存
# for item in msg_list:
#     item['child']=[]
#     msg_list[item['id']]=item
#
# #程序运行到此处，会有两个msg_list   msg_list_dict
# ret=[]
# for item in  msg_list:
#     pid=item['parent_id']
#     if pid:
#         msg_list[pid]['child'].apend(item)
#     else:
#         ret.append(item)

msg_list = [
    {'id':1,'content':'xxx','parent_id':None},
    {'id':2,'content':'xxx','parent_id':None},
    {'id':3,'content':'xxx','parent_id':None},
    {'id':4,'content':'xxx','parent_id':1},
    {'id':5,'content':'xxx','parent_id':4},
    {'id':6,'content':'xxx','parent_id':2},
    {'id':7,'content':'xxx','parent_id':5},
    {'id':8,'content':'xxx','parent_id':3},
]
msg_dict={}

#1、给所以 评论设置一个 child键=[空列表的值] [row.setdefault('child',[]) for row in msg_list] 列表生成器方法

#3、定义一个查询用的字典
for item in msg_list:
    item['child']=[]
    msg_dict[item['id']]=item



#2、把带有'parent_id'的键的字典，添加到对应的父字典里（你会想到再次遍历msg_list，但是多层循环效率低下，于是重新定义一个字典）
for item in msg_list:
    pid=item['parent_id']
    if pid:
        msg_dict[pid]['child'].append(item)


# 4、找出根评论·
root_coment=[]
for item in msg_list:
    if not item['parent_id']:
        root_coment.append(item)

for item in  root_coment:
    print(item)

 

模板

    '''   
    <div class="cooment">
        <div class="content"></div>  根评论
            <div class="cooment">
                <div class="content"></div> 子评论
                <div class="content"></div> 子评论
                <div class="content"></div> 子评论
             </div>  
        <div class="content"></div> 根评论
            <div class="cooment">
                <div class="content"></div> 子评论
                <div class="content"></div> 子评论
                <div class="content"></div> 子评论
             </div>  
        <div class="content"></div>  根评论
        <div class="content"></div>
    </div>    
    '''
    #----------------------------------------------
    comment_str=''
    comment_str += '<div class="comment">'
    for row in result:
        tp1='<div class="content">%s</div>'% (row['content'])
        comment_str+=tp1

        if row['child']:
            for chil in row['child']:
                comment_str += '<div class="comment">'
                tp1 = '<div class="content">%s</div>' % (chil['content'])
                comment_str += tp1
            comment_str += '</div>'


    comment_str += '</div>'
    return render(request,'comment.html',locals())

 

多级评论之博客园结构版

思路

1、评论区和评论展示区域

  <form action="/comment/" method="post" novalidate>
        {% csrf_token %}
        {{ obj.content }} <span id="errors"></span>                                                  评论展示区域
        <p>
            <input type="button" value="发表" class="btn btn-primary ajax_comment">                   评论发表区域
        </p>
    </form>

2、评论在评论发表区域属于之后使用ajax提交到server存储数据库

<script>
        $('.ajax_comment').click(function () {
            {#           由于评论内容前缀携带@父评论\n，所以需要 找到'\n'的字符串索引进行截断#}
            var $index = $('[name="content"]').val().indexOf('\n')
            var $content = $('[name="content"]').val().substr($index + 1)
            var $csrf = $("[name='csrfmiddlewaretoken']").val();
            var $article_id = {{ artic.nid }};

            var formdata = new FormData();
            formdata.append('csrfmiddlewaretoken', $csrf)
            formdata.append('content', $content)
            formdata.append('article_id', $article_id)
            formdata.append('parent_id_id', $prant_comment_id)
            {% if request.user.is_authenticated %}
                $.ajax({
                    url: '/comment/',
                    type: 'post',
                    data: formdata,
                    processData: false,
                    contentType: false,
                    success: function (data) {

 

3、server存储完成后，把成功消息回传浏览器

def comment(request):
    responses={'flag':True,'msg':None}
    obj=Commenform(request.POST)
    if obj.is_valid():
        content=obj.cleaned_data['content']
        article_id=request.POST.get('article_id')
        user_id=request.user.nid
        parent_id_id=request.POST.get('parent_id_id',)
        comment_obj=models.Comment.objects.create(article_id=article_id,
                                      content=content,
                                      parent_id_id=parent_id_id,
                                      user_id=user_id,
                                      )
        responses['create_time']=str(comment_obj.create_time)[:16]
        models.Article.objects.filter(nid=article_id).update(
                                comment_count=F('comment_count')+1)
    else:
        responses['flag']=False
        responses['msg']=obj.errors
    return HttpResponse(json.dumps(responses))

 

4、此时数据库中已有数据，通过页面刷新即可获得最新评论，可是体验不佳，于是浏览器可以通过 server端回传的信号，使用JavaScript或jQuery动态添加评论标签，制造显示效果；

if (data['flag']) {
                            var $create_time = data['create_time'];
                            var $content = $('[name="content"]').val();
                            s = '<li class="list-group-item comment_item"><a href="">{0}</a><a href="">{1}</a><a href="" ' +
                                'class="pull-right">&nbsp;支持</a> <a href="#comment_content" class="pull-right reply_btn">' +
                                '回复</a><span class="{2}"></span> <div> <span>{3}</span> <p>{4}</p></div> </li>'
                            s = s.format(
                                '{{ request.user.username }}',
                                $create_time,
                                $prant_comment_id,
                                $fathercomment_username,
                                $content
                            );

                            $('.comment_list').append(s)
                            $('[name="content"]').val(' ');
                            $prant_comment_id = '';
                            $fathercomment_username = '';


                        }
                        else {
                            $.each(data['msg'], function (i, j) {
                                $('#errors').text(j[0]).css('color', 'red')
                                setTimeout(function () {
                                    $("#errors").text("")
                                }, 1000)


                            })
                        }
                    }

                })
View Code

 

5、根评论搞定（对文章的评论），可是如果涉及对评论进行评论呢？利用A标签的锚特效， 当用户点击回复的A标签，同样锚定到评论区域‘’

 

 

 6、于此同时 给回复A标签绑定其他事件，携带 父级评论的ID、内容

 <script>
        var $prant_comment_id = '';
        var $fathercomment_username = '';
        $(".comment_list").on("click", "#reply_btn", function () {
            var $fathercomment_username = $(this).siblings().eq(0).text()
            $('#comment_content').val('@' + $fathercomment_username + '\n')
            $prant_comment_id = $(this).siblings().eq(3).attr('name')


        })
    </script>

 

 

 

 

 

 

转载于:https://www.cnblogs.com/sss4/p/7501978.html

agurt80004
关注
树形递归遍历实现多级评论
u012925323的博客
11-20 7885
最近参加了学校的网页设计大赛，做了一个论坛网站，期间后台的多级评论用了我很多时间，什么是多级评论呢，也就是针对某一条评论，其他用户都可以在该评论基础上回复对方，这样也就形成了一条树形结构，我用了递归来实现树的遍历，感觉哥哥算法很有用，在许多方面都有可能用到，比如说像QQListView分组显示都可以用它来实现。具体实现思路：1、通过构建节点来记录数据，节点要求：记录父节点；记录自身节点，记录子节点，
mysql多级评论表_多级评论的实现思路
weixin_39943370的博客
02-18 985
一、表结构class UserInfo(models.Model):"""用户表"""username = models.CharField(max_length=32)password = models.CharField(max_length=64)email = models.CharField(max_length=32,null=True)def __str__(self):return...
基于tp的评论和回复（支持多级）
01-03
做的一个基于tp框架的评论和回复的小例子（支持多级），有需要的话可以看一下，欢迎提出改进意见建议
多级评论系统的设计
大鲸鱼吃小鲸鱼的专栏
12-30 4295
在设计多级评论系统时，查看了很多平台和别人的设计，基本是一样： 两级评论，第一级评论“文章”、“微博”等主题Topic，第二级评论这是回复reply，针对的主体时comment。reply无限次循环。 例如简书： 例如头条： 也有一种简单的灌贴逻辑。不在这里讨论。 设计思路 一级二级评论存放一张表，通过标记pid来区分。如果有需要提炼精选评论，可以额外扩展表结构。 客户端...
springboot+mysql 实现二级评论 （主要是思路）
c22cxz的博客
03-04 3917
animal项目设计做了 二级评论（代码实现） 数据库表设计： 一级评论： 二级评论： 参考思路： 二级评论表的数据库设计（双表） Java+MySQL实现评论功能设计开发（双表） 如何实现类似简书这样的二级评论？ SpringBoot+Spring Data JPA 实现留言评论，评论回复（单表设计） 多级评论单表结构设计 ...
mongoose 实现评论功能（一级和二级评论）
Zhooson的博客
12-09 2736
创建数据，可以创建一级和二级评论， 查询返回数据整合数据返回，具体实现效果如下。具体启动node，连接mongodb ，创建router，controller等操作自行处理。 最终的数据结构 1. 创建model 一级评论 parentId：0， 二级评论为 parentId：_id from to 可以关联User表，这里为了演示，只当输入字段处理 const mongoose =...
多级评论单表结构设计
热门推荐
Dangerous
07-25 1万+
这里的多级，本质上其实也就二级，例如微博的评论， 一级评论： 对微博的评论 二级评论： 对微博下的评论的回复评论 ，这里包括二种 1. 回复的是一级评论， 2, 回复的是二级评论 效果如下： 表数据： 查询文章评论时： SELECT * from comment where article_id = '1' and comment_level = 1 ORDER B...
0711springNews新闻系统管理项目包 实现多级评论
最新发布
07-19
0711springNews新闻系统管理项目包
Django搭建个人博客：用django-mptt实现多级评论功能
weixin_43217710的博客
05-04 1348
现在我们的博客已经具有评论功能了。随着文章的评论者越来越多，有的时候评论者之间也需要交流，甚至部分评论还能合并成一个小的整体。因此最好是有某种方法可以将相关的评论聚集到一起，这时候多级评论就非常的有用了。 多级评论意味着你需要将模型重新组织为树形结构。“树根”是一级评论，而众多“树叶”则是次级评论。本教程会以第三方库django-mptt为基础，开发多级评论功能。 django-mptt模块包含...
多级评论回复功能（纯前端，未连数据库）
weixin_40758850的博客
06-03 7391
效果图： html结构（css我就不放了）： <div> <!--我的评论--> <div class="my-comment"> <textarea class="textarea" name="" id="" cols="30" rows="10" placeholder="快来说点什么吧~"></t...
Vue + semanticUI + Java 实现多级评论
王星星
08-25 4138
交友 背景： 最近在弄一个博客网站，前端是vue + segmentUI ，后台用的springboot。在弄到评论这一块的时候，不知道级联嵌套评论怎么搞，从上午想到现在想出来了，特来记录一下 后台 后台是通过树来实现的。 数据库的表结构如下所示： 需要做的就是通过这个表，构建一个树，java代码如下： package cn.zi10ng.blog.util; import cn.zi10...
多级评论的实现思路
weixin_30778805的博客
11-13 2152
一、表结构 class UserInfo(models.Model): """用户表""" username = models.CharField(max_length=32) password = models.CharField(max_length=64) email = models.CharField(max_length=32,nul...
多级评论算法
qq_37453240的博客
02-20 1304
comment_list=models.Comment.objects.filter(news_id=new_id)ret=[]  # 最终拿到的数据comment_list_dict={}  # 构建的中间字典for row in comment_list:  # 通过查到的数据中的id作为key，每一行数据作为value生成一个字典    row.update({"children":[]})...
Java递归实现评论多级回复
qq_42700121的博客
06-26 690
最近工作需要做一个评论功能，除了展示评论之外，还需要展示评论回复，评论的回复的回复，这里就用到了递归实现评论的多级回复。 评论实体 数据库存储字段： id 评论id、parent_id 回复评论id、message 消息。其中如果评论不是回复评论，parent_id 为-1。 创建一个评论实体 Comment： public class Comment {    /**     *&n.
个人博客网站——留言及多级回复功能
nice___amusin的博客
04-13 5107
通常情况下，在博客网站中，无论是文章下的评论还是单独的留言，都会有多级的回复功能。这里我们主要介绍多级回复功能的留言实现。 新增留言 在这里的新增留言，由留言板块、姓名板块和邮箱板块组成，其中隐藏获取了用户的电脑和浏览器内核版本。 <!--新增留言--> <div id="message-form" class="ui form"> <input type="hidden" name="parentMessage.id" value="
实现层级评论
举的博客
04-20 1530
实现层级评论1. 预热写一个函数，输入整数n，能够输出斐波那契数列中第n个的值。2. 分析层级评论从现象分析：我们可以把每一条评论抽象为字母，为了方便识别，我们约定首层评论为A，B ， C，D之类不带数字的字母。ABCD的直接子评论为A1，A2,B1,B2之类的。A1 A2，B1， B2的子评论为A1-1， A1-2，B1-1，B1-2。。A1-1的子评论为A1-1-1，A1-1-2等等以此类推那...
mybatisplus多级评论
04-26
在使用MyBatis-Plus实现多级评论时，可以按照以下步骤进行： 1. 数据库设计：首先需要设计数据库表结构来存储评论和回复的信息。一般情况下，可以设计两张表，一张表用于存储评论信息，另一张表用于存储回复信息。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值