python之day21(chouti)

1、文件上传
    a. Html Form表单提交
    b. Ajax提交
        原生XMLHttpRequest
            http://www.cnblogs.com/wupeiqi/articles/5703697.html
            
            XmlHttpReqeust() 类
            xhr = XmlHttpReqeust()
            xhr.send("k1=v1;k2=v2")
            
            
        jQuery Ajax
            $.ajax({}) 内部调用XmlHttpReqeust来发送的Ajax
            
            $.ajax({
                data: {'k1': 'v1', 'k2': 'v2'}
            })
        
 

 1 from django.shortcuts import render,HttpResponse
 2 import os,json
 3 # Create your views here.
 4 
 5 
 6 # def upload(request):
 7 #     if request.method == 'POST':
 8 #         user = request.POST.get('user')
 9 #         img = request.FILES.get('img')
10 #         f = open(os.path.join('static',img.name),'wb')
11 #         for chunk in img.chunks():
12 #             f.write(chunk)
13 #         f.close()
14 #     return render(request, 'upload.html')
15 
16 def ajax(request):
17     import time
18     crrent_time = time.time()
19     return render(request,'ajax.html',{'crrent_time':crrent_time})
20 
21 def xhr_ajax(request):
22     print(request.GET)
23     print(request.POST)
24     return HttpResponse('ok')
25 
26 
27 def upload(request):
28     if request.method == 'POST':
29         ret = {'status':False, 'data':None, 'error': None}
30 
31         try:
32             user = request.POST.get('user')
33             img = request.FILES.get('img')
34             file_path = os.path.join('static',img.name)
35             f = open(file_path,'wb')
36             for chunk in img.chunks():
37                 f.write(chunk)
38             f.close()
39             ret['status'] = True
40             ret['data'] = file_path
41         except Exception as e:
42             ret['error'] = str(e)
43         return HttpResponse(json.dumps(ret))
44     return render(request, 'upload.html')
Views
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6     <style>
 7         .img{
 8             height: 300px;
 9             width: 300px;
10         }
11     </style>
12 </head>
13 <body>
14     <iframe id="my_iframe" name="my_iframe" style="display: none" src="" ></iframe>
15 
16     <form id="fo" method="POST" action="/upload/" enctype="multipart/form-data">
17         <input type="text" id="user" name="user">
18 {#        <input type="file" id="img" name="img">#}
19         <input type="file" id="img" name="img" onchange="uploadFile3()">
20         <input type="submit">
21 
22     </form>
23     <div id="container" >
24 
25     </div>
26 {#    <a style="cursor: pointer" onclick="uploadFile1();">XMLHttpRequest</a>#}
27 {#    <a onclick="uploadFile2();">jqueryajax上传</a>#}
28     <script src="/static/jquery-2.1.4.min.js"></script>
29     <script>
30         function uploadFile1() {
31             var form = new FormData();
32             form.append('user',document.getElementById('user').value);
33 
34             var fileObj = document.getElementById("img").files[0];
35             form.append('img',fileObj)
36             var xhr = new XMLHttpRequest();
37             xhr.onreadystatechange = function () {
38                 if(xhr.readyState == 4){
39                     var data = xhr.responseText;
40                     console.log(data);
41                 }
42             };
43             xhr.open("post", "/upload/", true);
44             xhr.send(form);
45         }
46 
47 
48         function uploadFile2() {
49             var fileObj = $("#img")[0].files[0];
50             var form = new FormData();
51             form.append('img',fileObj);
52             form.append('user','alex');
53 
54             $.ajax({
55                 type: 'POST',
56                 url: '/upload/',
57                 data: form,
58                 processData: false,
59                 contentType: false,
60                 success: function (arg) {
61                     console.log(arg);
62 
63                 }
64 
65 
66             })
67 
68         }
69 
70         
71         function uploadFile3() {
72             $('#container').find('img').remove();
73             document.getElementById('my_iframe').onload = callback;
74             document.getElementById('fo').target = 'my_iframe';
75             document.getElementById('fo').submit();
76         }
77         
78         function callback() {
79             var text = $('#my_iframe').contents().find('body').text();
80             var json_data = JSON.parse(text);
81             console.log(json_data);
82             if(json_data.status){
83                 var tag = document.createElement('img');
84                 tag.src = '/' + json_data.data;
85                 tag.className = 'img';
86                 $('#container').append(tag);
87             }else{
88                 alert(json_data.error);
89             }
90             
91         }
92 
93     </script>
94 
95 
96 </body>
97 </html>
upload
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title></title>
 6 </head>
 7 <body>
 8     {{ crrent_time }}
 9     <input type="button" value="XMLHttpRequest按钮" onclick="XhrAjax();"/>
10     <input type="button" value="XMLHttpRequest,FormData按钮" onclick="XhrAjaxForm();"/>
11     <script>
12         function XhrAjax(){
13             var xhr = new XMLHttpRequest();
14             xhr.onreadystatechange = function(){
15                // 只有服务器端返回数据时，处理请求
16                 if(xhr.readyState == 4){
17                     // 服务器端响应的内容已经接受完毕
18                     console.log(xhr.responseText);
19                 }
20             };
21             // GET请求
22             //xhr.open('GET', '/xhr_ajax?p=123');
23             //xhr.send();
24             // POST请求
25             xhr.open('POST', '/xhr_ajax/');
26             // 设置请求头
27             xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset-UTF-8');
28             xhr.send("k1=v1;k2=v2");
29         }
30         function XhrAjaxForm(){
31             var xhr = new XMLHttpRequest();
32             xhr.onreadystatechange = function(){
33                // 只有服务器端返回数据时，处理请求
34                 if(xhr.readyState == 4){
35                     // 服务器端响应的内容已经接受完毕
36                     console.log(xhr.responseText);
37                 }
38             };
39             // GET请求
40             //xhr.open('GET', '/xhr_ajax?p=123');
41             //xhr.send();
42             // POST请求
43             xhr.open('POST', '/xhr_ajax/');
44             // 设置请求头
45             // xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset-UTF-8');
46             var form = new FormData();
47             form.append('user', 'alex');
48             form.append('pwd', '123');
49             xhr.send(form);
50         }
51     </script>
52 </body>
53 </html>
ajex

   

2、验证码 + session

  1 import random
  2 from PIL import Image, ImageDraw, ImageFont, ImageFilter
  3 
  4 _letter_cases = "abcdefghjkmnpqrstuvwxy"  # 小写字母，去除可能干扰的i，l，o，z
  5 _upper_cases = _letter_cases.upper()  # 大写字母
  6 _numbers = ''.join(map(str, range(3, 10)))  # 数字
  7 init_chars = ''.join((_letter_cases, _upper_cases, _numbers))
  8 
  9 def create_validate_code(size=(120, 30),
 10                          chars=init_chars,
 11                          img_type="GIF",
 12                          mode="RGB",
 13                          bg_color=(255, 255, 255),
 14                          fg_color=(0, 0, 255),
 15                          font_size=18,
 16                          font_type="Monaco.ttf",
 17                          length=4,
 18                          draw_lines=True,
 19                          n_line=(1, 2),
 20                          draw_points=True,
 21                          point_chance = 2):
 22     '''
 23     @todo: 生成验证码图片
 24     @param size: 图片的大小，格式（宽，高），默认为(120, 30)
 25     @param chars: 允许的字符集合，格式字符串
 26     @param img_type: 图片保存的格式，默认为GIF，可选的为GIF，JPEG，TIFF，PNG
 27     @param mode: 图片模式，默认为RGB
 28     @param bg_color: 背景颜色，默认为白色
 29     @param fg_color: 前景色，验证码字符颜色，默认为蓝色#0000FF
 30     @param font_size: 验证码字体大小
 31     @param font_type: 验证码字体，默认为 ae_AlArabiya.ttf
 32     @param length: 验证码字符个数
 33     @param draw_lines: 是否划干扰线
 34     @param n_lines: 干扰线的条数范围，格式元组，默认为(1, 2)，只有draw_lines为True时有效
 35     @param draw_points: 是否画干扰点
 36     @param point_chance: 干扰点出现的概率，大小范围[0, 100]
 37     @return: [0]: PIL Image实例
 38     @return: [1]: 验证码图片中的字符串
 39     '''
 40 
 41     width, height = size # 宽， 高
 42     img = Image.new(mode, size, bg_color) # 创建图形
 43     draw = ImageDraw.Draw(img) # 创建画笔
 44 
 45     def get_chars():
 46         '''生成给定长度的字符串，返回列表格式'''
 47         return random.sample(chars, length)
 48 
 49     def create_lines():
 50         '''绘制干扰线'''
 51         line_num = random.randint(*n_line) # 干扰线条数
 52 
 53         for i in range(line_num):
 54             # 起始点
 55             begin = (random.randint(0, size[0]), random.randint(0, size[1]))
 56             #结束点
 57             end = (random.randint(0, size[0]), random.randint(0, size[1]))
 58             draw.line([begin, end], fill=(0, 0, 0))
 59 
 60     def create_points():
 61         '''绘制干扰点'''
 62         chance = min(100, max(0, int(point_chance))) # 大小限制在[0, 100]
 63 
 64         for w in range(width):
 65             for h in range(height):
 66                 tmp = random.randint(0, 100)
 67                 if tmp > 100 - chance:
 68                     draw.point((w, h), fill=(0, 0, 0))
 69 
 70     def create_strs():
 71         '''绘制验证码字符'''
 72         c_chars = get_chars()
 73         strs = ' %s ' % ' '.join(c_chars) # 每个字符前后以空格隔开
 74 
 75         font = ImageFont.truetype(font_type, font_size)
 76         font_width, font_height = font.getsize(strs)
 77 
 78         draw.text(((width - font_width) / 3, (height - font_height) / 3),
 79                     strs, font=font, fill=fg_color)
 80 
 81         return ''.join(c_chars)
 82 
 83     if draw_lines:
 84         create_lines()
 85     if draw_points:
 86         create_points()
 87     strs = create_strs()
 88 
 89     # 图形扭曲参数
 90     params = [1 - float(random.randint(1, 2)) / 100,
 91               0,
 92               0,
 93               0,
 94               1 - float(random.randint(1, 10)) / 100,
 95               float(random.randint(1, 2)) / 500,
 96               0.001,
 97               float(random.randint(1, 2)) / 500
 98               ]
 99     img = img.transform(size, Image.PERSPECTIVE, params) # 创建扭曲
100 
101     img = img.filter(ImageFilter.EDGE_ENHANCE_MORE) # 滤镜，边界加强（阈值更大）
102 
103     return img, strs
check_code
 1 def check_code(request):
 2     import io
 3     from backend import check_code as CheckCode
 4 
 5     stream = io.BytesIO()
 6     # img图片对象,code在图像中写的内容
 7     img, code = CheckCode.create_validate_code()
 8     img.save(stream, "png")
 9 
10     request.session["CheckCode"] = code
11     return HttpResponse(stream.getvalue())
12 
13     # 代码：生成一张图片，在图片中写文件
14     # request.session['CheckCode'] =  图片上的内容
15 
16     # 自动生成图片，并且将图片中的文字保存在session中
17     # 将图片内容返回给用户
Views
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <form action="/login/" method="POST">
        <input type="text" name="username" />
        <input type="text" name="pwd" />
        <input type="text" name="check_code" />
        <img src="/check_code/" onclick="ChangeCode(this);">
        <input type="submit" />
    </form>
    <script>
        function ChangeCode(ths){
            ths.src = ths.src + '?';
        }
    </script>
</body>
</html>
login



抽屉：
    需求分析
    数据库设计
        - 用户表
        - 短信、邮件临时表
        - 新闻类型表：
            1  42区
            2  段子
            3  兔皮纳
            4  挨踢
            5  你问我答
        - 新闻表：
                标题，摘要，url，赞数1
                
                    http://dajia.qq.com/original/oldtimes/csc20160925.html
                图片路径(url)，摘要
                    /detail/1
                    
                标题：asdf
                摘要：asdfasd
                URL：http://dajia.qq.com/original/oldtimes/csc20160925.html
                类型：1
                
                标题：
                摘要：asdfasd
                URL：http://dajia.qq.com/original/oldtimes/csc20160925.html
                类型：2
                
        - 点赞表
            新闻ID    用户ID
              1         1    
        
        - 评论表
            新闻ID    用户ID    评论内容   评论事件    顶   踩

 1 from django.db import models
 2 
 3 # Create your models here.
 4 
 5 class SendMsg(models.Model):
 6 
 7     nid = models.AutoField(primary_key=True)
 8     code = models.CharField(max_length=6)
 9     email = models.CharField(max_length=32, db_index=True)
10     times = models.IntegerField(default=0)
11     ctime = models.DateTimeField()
12 
13 
14 class UserInfo(models.Model):
15     nid = models.AutoField(primary_key=True)
16     username = models.CharField(max_length=32, unique=True)
17     password = models.CharField(max_length=32)
18     email = models.CharField(max_length=32, unique=True)
19     ctime = models.DateTimeField()
20 
21 class NewsType(models.Model):
22     nid = models.AutoField(primary_key=True)
23 
24     caption = models.CharField(max_length=32)
25 
26 class News(models.Model):
27     nid = models.AutoField(primary_key=True)
28     user_info = models.ForeignKey('UserInfo')
29     news_type = models.ForeignKey('NewsType')
30     title = models.CharField(max_length=32, db_index=True)
31     url = models.CharField(max_length=128)
32     content = models.CharField(max_length=50)
33     favor_count = models.IntegerField(default=0)
34     comment_count = models.IntegerField(default=0)
35     ctime = models.DateTimeField()
36 
37 
38 class Favor(models.Model):
39     nid = models.AutoField(primary_key=True)
40     user_info = models.ForeignKey('UserInfo')
41     news = models.ForeignKey('News')
42     ctime = models.DateTimeField()
43 
44     class Meta:
45         unique_together = (("user_info", "news"),)
46 
47 class Comment(models.Model):
48     nid = models.AutoField(primary_key=True)
49 
50     user_info = models.ForeignKey('UserInfo')
51     news = models.ForeignKey('News')
52 
53     up = models.IntegerField(default=0)
54     down = models.IntegerField(default=0)
55     ctime = models.DateTimeField()
56 
57 
58     device = models.CharField(max_length=16)
59     content = models.CharField(max_length=150)
60 
61     reply_id = models.ForeignKey('Comment', related_name='b', null=True, blank=True)
models

            
        
        
    功能开发：
        注册
        登录
        发布新闻
        点赞
        评论    

#!/usr/bin/env python
# -*- coding:utf-8 -*-
import io
import json
import datetime

from django.shortcuts import HttpResponse,redirect

from web.forms.account import SendMsgForm,RegisterForm,LoginForm
from web import models

from backend import commons
from backend.utils import check_code as CheckCode
from backend.utils.response import BaseResponse


def check_code(request):
    stream = io.BytesIO()
    img, code = CheckCode.create_validate_code()
    img.save(stream, "png")
    request.session["CheckCode"] = code
    return HttpResponse(stream.getvalue())


def send_msg(request):
    rep = BaseResponse()
    # rep.__dict__
    #  {'status': True, 'error': ''}
    # ret =
    # ret['status']
    form = SendMsgForm(request.POST)
    if form.is_valid():
        # 如果认证成功后，获取用户输入的数据
        _value_dict = form.clean()
        email = _value_dict['email']

        has_exists_email = models.UserInfo.objects.filter(email=email).count()
        if has_exists_email:
            rep.summary = "此邮箱已经被注册"
            return HttpResponse(json.dumps(rep.__dict__))


        current_date = datetime.datetime.now() # 获取当前事件
        code = commons.random_code()  # 随机验证码

        count = models.SendMsg.objects.filter(email=email).count()
        if not count:
            models.SendMsg.objects.create(code=code, email=email, ctime=current_date)
            rep.status = True
        else:
            limit_day = current_date - datetime.timedelta(hours=1)

            times = models.SendMsg.objects.filter(email=email, ctime__gt=limit_day, times__gt=9).count()
            if times:
                rep.summary = "'已超最大次数（1小时后重试）'"
            else:
                unfreeze = models.SendMsg.objects.filter(email=email, ctime__lt=limit_day).count()
                if unfreeze:
                    models.SendMsg.objects.filter(email=email).update(times=0)

                from django.db.models import F
                models.SendMsg.objects.filter(email=email).update(code=code,
                                                                  ctime=current_date,
                                                                  times=F('times')+1)
                rep.status = True
    else:

        error_dict = json.loads(form.errors.as_json())
        rep.summary = error_dict['email'][0]['message']

    print(rep.__dict__)
    return HttpResponse(json.dumps(rep.__dict__))


def register(request):
    rep = BaseResponse()
    form = RegisterForm(request.POST)
    if form.is_valid():
        current_date = datetime.datetime.now()
        limit_day = current_date - datetime.timedelta(minutes=1)
        _value_dict = form.clean()

        is_valid_code = models.SendMsg.objects.filter(email=_value_dict['email'],
                                                      code=_value_dict['email_code'],
                                                      ctime__gt=limit_day).count()
        if not is_valid_code:
            rep.message['email_code'] = [{'message':'邮箱验证码不正确或过期'}]
            return HttpResponse(json.dumps(rep.__dict__))

        has_exists_email = models.UserInfo.objects.filter(email=_value_dict['email']).count()

        if has_exists_email:
            rep.message['email'] = [{'message':'邮箱已经存在'}]
            return HttpResponse(json.dumps(rep.__dict__))

        has_exists_username = models.UserInfo.objects.filter(username=_value_dict['username']).count()
        if has_exists_username:
            rep.message['email'] = [{'message':'用户名已经存在'}]
            return HttpResponse(json.dumps(rep.__dict__))

        _value_dict['ctime'] = current_date
        _value_dict.pop('email_code')
        obj = models.UserInfo.objects.create(**_value_dict)

        user_info_dict = {'nid': obj.nid, 'email': obj.email, 'username': obj.username}

        models.SendMsg.objects.filter(email=_value_dict['email']).delete()

        request.session['is_login'] = True
        request.session['user_info'] = user_info_dict
        print(request.session['user_info'])
        rep.status = True

    else:
        error_msg = form.errors.as_json()
        rep.message = json.loads(error_msg)
    return HttpResponse(json.dumps(rep.__dict__))


def login(request):
    print('login')
    rep = BaseResponse()
    form = LoginForm(request.POST)
    if form.is_valid():
        _value_dict = form.clean()
        if _value_dict['code'].lower() != request.session["CheckCode"].lower():
            rep.message = {'code':[{'message':'验证码错误'}]}
            return HttpResponse(json.dumps(rep.__dict__))

        from django.db.models import Q
        con = Q()

        q1 = Q()
        q1.connector = 'AND'
        q1.children.append(('email', _value_dict['user']))
        q1.children.append(('password', _value_dict['pwd']))

        q2 = Q()
        q2.connector = 'AND'
        q2.children.append(('username', _value_dict['user']))
        q2.children.append(('password', _value_dict['pwd']))

        con.add(q1, 'OR')
        con.add(q2, 'OR')

        obj = models.UserInfo.objects.filter(con).first()
        if not obj:
            rep.message = {'user': [{'message':'用户名邮箱或密码错误'}]}
            return HttpResponse(json.dumps(rep.__dict__))

        request.session['is_login'] = True
        request.session['user_info'] = {'nid': obj.nid, 'email': obj.email, 'username': obj.username}
        rep.status = True
    else:
        error_msg = form.errors.as_json()
        print(error_msg)
        rep.message = json.loads(error_msg)

    return HttpResponse(json.dumps(rep.__dict__))


def logout(request):

    request.session.clear()
    return redirect('/index/')
account
#!/usr/bin/env python
# -*- coding:utf-8 -*-
import os
import copy
import datetime
import json

from django.shortcuts import render, HttpResponse
from django.db.models import F

from web import models
from web.forms.home import IndexForm

from backend.utils.pager import Pagination
from backend.utils.response import BaseResponse,StatusCodeEnum
from backend import commons


class CJsonEncoder(json.JSONEncoder):
    def default(self, obj):
        if isinstance(obj, datetime.datetime):
            return obj.strftime('%Y-%m-%d %H:%M:%S')
        else:
            return json.JSONEncoder.default(self, obj)


# json.dumps({'d': datetime.now()}, cls=DatetimeEncoder)


def index(request):
    # print(request.session['is_login'])
    # print(request.session['user_info'])

    if request.method == 'GET':
        page = request.GET.get('page', 1)
        all_count = models.News.objects.all().count()

        obj = Pagination(page, all_count)

        # result = models.News.objects.all().values_list('nid',
        #                                               'title',
        #                                               'url',
        #                                               'content',
        #                                               'ctime',
        #                                               'user_info__username',
        #                                               'news_type__caption',
        #                                               'favor_count',
        #                                               'comment_count',
        #                                               'favor__nid')[obj.start: obj.end]
        sql = """
        SELECT
            "web_news"."nid",
            "web_news"."title",
            "web_news"."url",
            "web_news"."content",
            "web_news"."ctime",
            "web_userinfo"."username",
            "web_newstype"."caption",
            "web_news"."favor_count",
            "web_news"."comment_count",
            "web_favor"."nid"
        FROM
            "web_news"
        LEFT OUTER JOIN "web_userinfo" ON (
            "web_news"."user_info_id" = "web_userinfo"."nid"
        )
        LEFT OUTER JOIN "web_newstype" ON (
            "web_news"."news_type_id" = "web_newstype"."nid"
        )
        LEFT OUTER JOIN "web_favor" ON (
            "web_news"."nid" = "web_favor"."news_id"
            and
            "web_news".user_info_id = %s
        )

        LIMIT 10 OFFSET %s
        """

        from django.db import connection
        cursor = connection.cursor()
        if request.session.get('user_info'):
            cursor = connection.cursor()
            current_login_user_nid = request.session['user_info']['nid']
            cursor.execute(sql, [current_login_user_nid, obj.start])
        else:
            cursor.execute(sql, [None, obj.start])
        result = cursor.fetchall()
        print(result)
        str_page = obj.string_pager('/index/')

        return render(request, 'index.html', {'str_page': str_page, 'news_list': result})
    else:
        rep = BaseResponse()

        form = IndexForm(request.POST)
        if form.is_valid():
            # title,content,href,news_type,user_info_id
            _value_dict = form.clean()
            input_dict = copy.deepcopy(_value_dict)
            input_dict['ctime'] = datetime.datetime.now()
            input_dict['user_info_id'] = request.session['user_info']['nid']
            models.News.objects.create(**input_dict)
            rep.status = True
        else:

            error_msg = form.errors.as_json()
            rep.message = json.loads(error_msg)

        return HttpResponse(json.dumps(rep.__dict__),)


def favor(request):
    rep = BaseResponse()

    news_id = request.POST.get('news_id', None)
    if not news_id:
        rep.summary = "新闻ID不能为空."
    else:
        user_info_id = request.session['user_info']['nid']

        has_favor = models.Favor.objects.filter(user_info_id=user_info_id, news_id=news_id).count()
        if has_favor:
            models.Favor.objects.filter(user_info_id=user_info_id, news_id=news_id).delete()
            models.News.objects.filter(nid=news_id).update(favor_count=F('favor_count')-1)

            rep.code = StatusCodeEnum.FavorMinus
        else:
            models.Favor.objects.create(user_info_id=user_info_id, news_id=news_id, ctime=datetime.datetime.now())
            models.News.objects.filter(nid=news_id).update(favor_count=F('favor_count')+1)

            rep.code = StatusCodeEnum.FavorPlus

        rep.status = True

    return HttpResponse(json.dumps(rep.__dict__))


def upload_image(request):

    rep = BaseResponse()
    try:
        obj = request.FILES.get('img')
        file_path = os.path.join('statics', 'upload', commons.generate_md5(obj.name))

        f = open(file_path, 'wb')
        for chunk in obj.chunks():
            f.write(chunk)
        f.close()

        rep.status = True
        rep.data = file_path
    except Exception as ex:
        rep.summary = str(ex)
    return HttpResponse(json.dumps(rep.__dict__))

def comment(request):
    rep = BaseResponse()
    if request.method == "POST":
        user_info_id = request.session.get('user_info')['nid']
        news_id = request.POST.get('news_id', None)
        device = request.POST.get('device', None)
        content = request.POST.get('content', None)
        reply_id = request.POST.get('reply_id', None)
        ctime = datetime.datetime.now()
        # models.Comment.objects.create(user_info_id=user_info)
        username = request.session.get('user_info')['username']
        rep.status = True
        # print(user_info, news_id, ctime, device, content, reply_id )
        models.Comment.objects.create(user_info_id=user_info_id, news_id=news_id, ctime=ctime, device=device, content=content, reply_id=reply_id)
        models.News.objects.filter(nid=news_id).update(comment_count=F('comment_count') + 1)
        c = models.Comment.objects.filter(ctime=ctime).values('nid','user_info__username','news_id','content','reply_id','ctime')
        # print(c[0])
        rep.data = c[0]
        # print(json.dumps(rep.data))
    return HttpResponse(json.dumps(rep.__dict__, cls=CJsonEncoder))


def comment_tit(request):
    data_list = []
    if request.method == "GET":
        nid = request.GET.get('nid', None)
        # print(nid)
        count = models.Comment.objects.filter(news=nid).values('nid','user_info__username','news_id','content','reply_id', 'ctime')
        for item in count:
            print(item["ctime"])
            a = '<ul><li class="items" style="padding:8px 0 0 16px;"><span class="folder" id="comment_folder_'
            b = str(item["nid"])
            c = '"><div class="comment-L comment-L-top"><a href="#" class="icons zhan-ico"></a><a href="/user/moyujian/submitted/1"><img src="/statics/images/1.jpg"></a></div><div class="comment-R comment-R-top" style="background-color: rgb(246, 246, 246);"><div class="pp"><a class="name" href="/user/moyujian/submitted/1">'
            d = item["user_info__username"]
            e = '</a><span class="p3">'
            f = item["content"]
            g= '</span><span class="into-time into-time-top">'
            h = str(item["ctime"])
            i = '</span></div><div class="comment-line-top"><div class="comment-state"><a class="ding" href="javascript:void(0);"><b>顶</b><span class="ding-num">[0]</span></a><a class="cai" href="javascript:void(0);"><b>踩</b><span class="cai-num">[0]</span></a><span class="line-huifu">|</span> <a class="see-a jubao" href="javascript:void(0);">举报</a> <span class="line-huifu">|</span> <a class="see-a huifu-a" href="javascript:void(0);" onclick="'
            j = "reply(" + str(item['news_id']) + "," +str(item["nid"])+",'"+item["user_info__username"]+"')"
            k = '">回复</a></div></div></div></span></li></ul>'
            tag = a+b+c+d+e+f+g+h+i+j+k
            data_list.append(tag)
        data = "
".join(data_list)
        # data = '<ul><li class="items" style="padding:8px 0 0 16px;"><span class="folder" id="comment_folder_11"><div class="comment-L comment-L-top"><a href="#" class="icons zhan-ico"></a><a href="/user/moyujian/submitted/1"><img src="/statics/images/1.jpg"></a></div><div class="comment-R comment-R-top" style="background-color: rgb(246, 246, 246);"><div class="pp"><a class="name" href="/user/moyujian/submitted/1">alex</a><span class="p3">tetst123123</span><span class="into-time into-time-top">undefined</span></div><div class="comment-line-top"><div class="comment-state"><a class="ding" href="javascript:void(0);"><b>顶</b><span class="ding-num">[0]</span></a><a class="cai" href="javascript:void(0);"><b>踩</b><span class="cai-num">[0]</span></a><span class="line-huifu">|</span> <a class="see-a jubao" href="javascript:void(0);">举报</a> <span class="line-huifu">|</span> <a class="see-a huifu-a" href="javascript:void(0);" onclick="reply(3,11,"undefined")">回复</a></div></div></div></span></li></ul>"'
    return HttpResponse(data)
home
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>抽屉新热榜</title>
    <link rel="stylesheet" href="/statics/css/commons.css" />
    {% block css %} {% endblock %}
</head>
<body>
    <div class="pg-header">
        <div class="w">
            <a class="logo" href="/"></a>
            <div class="act-menu">
                <a href="/all/hot/recent/1" class="tb active">全部</a>
                <a href="/all/hot/recent/1" class="tb">42区</a>
                <a href="/all/hot/recent/1" class="tb">段子</a>
                <a href="/all/hot/recent/1" class="tb">图片</a>
                <a href="/all/hot/recent/1" class="tb">挨踢1024</a>
                <a href="/all/hot/recent/1" class="tb">你问我答</a>
            </div>
            <div class="key-sera">

                <form action="/search/show" method="post" name="searchFrm2" id="searchFrm2">
                    <input type="text" class="search-txt-s" name="words" id="txtSearch2" autocomplete="off">

                    <a href="javascript:;" class="i" name="searchBtn_2" id="searchBtn_3"><span class="ico"></span></a>
                    <input type="hidden" value="1" id="page" name="page">
                </form>

            </div>

            {% if request.session.is_login %}
                <div id="action_nav" is-login="true" class="action-nav">
                    <a href="/show/flow/1" style="float:left;position:relative;" id="btnDtaiShw">动态
                        <b class="notice-num-title" id="Dtai-num-title" style="right: 3px; display: none;">
                            <em id="Dtai-em"></em>
                        </b>
                    </a>
                    <a href="javascript:;" id="btnNotShw" class="notice-box">通知
                        <b class="notice-num-title" id="notice-num-title" style="display: none;">
                            <em id="notice-em"></em>
                            <i>+</i>
                        </b>
                    </a>
                    <a href="/user/link/saved/1" id="loginUserNc" class="userPro-Box">
                        <img src="" id="userProImg">
                        <span class="u-nick" id="userProNick">{{ request.session.user_info.username}}</span>
                        <em id="userProArr"></em>
                    </a>
                </div>
                <div class="user-opr-box" id="userOprBox" style="left: 869px; display: none;">
                    <a href="/user/link/saved/1" style="border-top:0;">我的新热榜</a>
                    <a href="/profile">设置</a>
                    <a class="logout" href="/logout/">退出</a>
                    <a href="http://www.chouti.com/cdu_45792645155" target="_blank" class="ie6-a">我的收藏</a>
                </div>
            {% else %}
                <div id="action_nav" is-login="false" class="action-nav">
                    <a href="javascript:void(0);" class="login-btn-a" id="reg_link_a">注册</a>
                    <a href="javascript:void(0);" class="login-btn-a" id="login_link_a">登录</a>
                </div>
            {% endif %}


        </div>

    </div>

    <div class="pg-body">

        {% block body %} {% endblock %}

    </div>

    <div class="pg-footer" style="background-color: #eee;">
        <div class="w" style="background-color: #ffffff;">
            <div class="foot-nav">
                <div style="display:none" id="y-destjid"></div>
                <div style="display:none" id="y-destnick"></div>
                <a href="/help/about" target="_blank">关于我们</a><span>|</span><a href="/help/contact" target="_blank">联系我们</a><span>|</span><a href="/help/service" target="_blank">服务条款</a><span>|</span><a href="/help/privacy" target="_blank">隐私政策</a><span>|</span><a href="/help/tool" target="_blank">抽屉新热榜工具</a><span>|</span><!--<a href="http://img.chouti.com/toolsffcj.html" target="_blank">浏览器插件</a><span>|</span>--><a href="/download/model" target="_blank">下载客户端</a><span>|</span><a href="/feedback" target="_blank">意见与反馈</a><span>|</span><a href="/help/goodlink" target="_blank">友情链接</a><span>|</span><a href="http://www.shouye.com/Index.do?method=show&amp;pageId=44251&amp;jid=xinrebang@gozap.com" target="_blank">公告</a><!--<span>|</span><a href="/points/gifts" target="_blank">积分商城</a>-->
                <a href="#" target="_blank" style="margin-left:0;vertical-align:-2px;" title="Rss订阅，Feed地址：http://dig.chouti.com/feed.xml"><img src="" width="36" height="14"></a>
            </div>
            <div class="foot-nav2">
                <a target="_blank" href="http://www.gozap.com/"><img class="foot_e" src=""></a>
                <span class="foot_d">旗下站点</span>
                <span class="foot_a">© 2016 chouti.com</span>
                <a target="_blank" href="http://www.miibeian.gov.cn/" class="foot_b">京ICP备09053974号-3 京公网安备 110102004562</a>
                <div style="margin-top:6px;">版权所有：北京格致璞科技有限公司</div>
            </div>
        </div>
    </div>

    <script src="/statics/js/jquery-1.12.4.js"></script>
    {% block javascript %} {% endblock %}
    <script>
        $(function(){
            $('#loginUserNc,#userOprBox').mouseover(function(){
                $('#userOprBox').css('display', 'block');
                $('#loginUserNc').addClass('active');
            }).mouseout(function () {
                $('#userOprBox').css('display', 'none');
                $('#loginUserNc').removeClass('active');
            })
        })
    </script>
</body>
</html>
_layout
{% extends "_layout.html" %}

{% block css %}
    <link rel="stylesheet" href="/statics/plugins/tab-menu-box/tab.css" />
{% endblock %}

{% block body %}
    <div style="background-color: #eee;">
        <div class="w body-content">
            <div class="clearfix">

                <div class="content-l" >
                    <div class="nav-top-area">
                        <div class="child-nav">
                            <a href="/r/pic/hot/1" hidefocus="false" class="icons active hotbtn" id="hotts-nav-btn">最热</a>
                            <a href="/r/pic/new/1" hidefocus="false" class="newbtn" id="newest-nav-btn">最新</a>
                        </div>

                        {% if userinfo.is_login %}
                            <a href="javascript:void(0);" class="publish-btn" id="publishBtn">
                                <span class="ico n1"></span><span class="n2">发布</span>
                            </a>
                        {% else %}
                            <a href="javascript:void(0);" class="publish-btn" id="publishBtn">
                                <span class="ico n1"></span><span class="n2">发布</span>
                            </a>
                        {% endif %}
                    </div>

                    <div class="content-list" id="content_list">
                        {% for item in news_list %}

                            <div class="item">

                                <div class="news-pic">
                                    <img src="" alt="抽屉新热榜" style="display: inline;">
                                </div>

                                <div class="null-item"></div>

                                <div class="news-content">
                                    <div class="part1">
                                        <a href="{{item.2}}" class="show-content" target="_blank">{{item.1}}</a>
                                        <span class="content-source">-wallstreetcn.com</span>
                                        <a href="/r/news/hot/1" class="n2">
                                            <span class="content-kind">{{item.6}}</span>
                                        </a>
                                    </div>
                                    <div class="area-summary">
                                        <span class="summary">{{item.3}}</span>
                                    </div>
                                    <div class="part2">
                                        <a href="javascript:void(0);" class="digg-a" title="推荐" onclick="DoFavor(this,{{item.0}});">
                                            {% if item.9 %}
                                                <span class="hand-icon icon-digg active"></span>
                                            {% else %}
                                                <span class="hand-icon icon-digg"></span>
                                            {% endif %}
                                            <b id="favor_count_{{item.0}}">{{item.7}}</b>
                                        </a>
                                        <a href="javascript:void(0);" class="discus-a" onclick="ToggleCommentArea({{item.0}});">
                                            <span class="hand-icon icon-discus"></span>
                                            <b id="comment_count_{{item.0}}">{{item.8}}</b>
                                        </a>
                                        <a href="javascript:void(0);" class="collect-a" >
                                            <span class="hand-icon icon-collect"></span><b>私藏</b>
                                        </a>
                                        <a href="#" class="user-a">
                                            <span><img src=""></span>
                                            <b>{{item.5}}</b>
                                        </a>
                                        <span class="time-into">
                                            <a class="time-a" href="#" target="_blank">
                                                <b>{{item.4|date:"Y-m-d H:i:s"}}</b>
                                            </a>
                                            <i>入热榜</i>
                                        </span>

                                    </div>
                                    <!-- 评论区域 -->
                                    <div id="comment_area_{{item.0}}" class="comment-box-area hide" >
                                        <div class="pinglun arrow" id="comt-arrow-8118680"></div>
                                        <a class="pinglun close-comt" title="关闭" href="javascript:void(0);" onclick="HideCommentArea({{item.0}});"></a>

                                        <div class="corner comment-box clearfix" >

                                            <div class="loading-ico loading-ico-top"  style="margin-left:230px;">加载中，请稍候...</div>

                                            <div class="comment-box-top hide" >
                                                <div class="tip-1">最热评论(<span>{{item.8}}</span>)</div>
                                                <div class="tip-2">
                                                    <a href="#" target="_blank">
                                                        <em class="pinglun em1"></em>
                                                        <span>去评论页面</span>
                                                    </a>
                                                </div>
                                            </div>

                                            <ul id="comment_list_{{item.0}}" class="filetree comment-list-top-2 treeview hide">

                                            </ul>

                                            <div class="huifu-top-box hide">
                                                <div class="box-l txt-input-area-div-top corner no-corner-bottom">
                                                    <div class="lab-comment-top">回复  <span id="reply_id_{{item.0}}"></span>:</div>
                                                    <!-- 针对谣言文本输入框无效 -->
                                                        <textarea id="comment_content_{{item.0}}" maxlength="150" name="txt-huifu-top" class="txt-huifu txt-huifu-top"></textarea>
                                                </div>
                                                <div class="box-r">
                                                    <a href="javascript:void(0);" class="pub-icons add-pub-btn add-pub-btn-unvalid" onclick="DoComment({{item.0}})">评论</a>
                                                    <a href="javascript:void(0);" class="loading-ico loading-ico-top pub-loading-top hide">发布中...</a>
                                                </div>
                                            </div>
                                            <div class="tip-3 ">
                                                <a href="javascript:void(0);" class="hiddenCom-Btn" onclick="HideCommentArea({{item.0}});">
                                                    <em class="pinglun em2"></em>
                                                    <span>收起</span>
                                                </a>
                                            </div>

                                        </div>

                                    </div>


                                </div>

                            </div>

                        {% endfor %}
                    </div>

                    <div class="pagination">
                        {{ str_page }}
                    </div>
                </div>


                <div class="content-r">

                </div>
            </div>
        </div>
    </div>

    <div class="shadow hide"></div>

    <div id="publishDialog" class="dialog hide">
        <div class="dialog-title-bar">
            <div class="dialog-title">
                <span>分享新发现</span>
            </div>
            <div class="dialog-close" onclick="CloseDialog('#publishDialog');">X</div>
        </div>
        <div class="dialog-content">
            <div class="tab-menu-box">
                <div class="menu">
                    <ul id="tab-menu-title">
                        <li content-to="1" class="current">链接</li>
                        <li content-to="2" >文字</li>
                        <li content-to="3" >图片</li>
                    </ul>
                </div>

                <div id="tab-menu-body" class="content">
                    <div content="1" class="publish-content clearfix">
                        <div class="tab-alt">添加链接</div>
                        <div class="f1 clearfix">
                            <div class="left"><input type="text"  name="url" /></div>
                            <div class="right"><a href="javascript:void(0);">获取标题</a></div>
                        </div>
                        <div class="tab-alt">标题</div>
                        <div class="f2">

                            <input type="text" name="title" />
                        </div>
                        <div class="tab-alt">添加摘要（选填）</div>
                        <div class="f2">
                            <textarea name="content"></textarea>
                        </div>
                        <div class="f3">
                            <span>发布到：</span>
                            <div class="news-type" style="display: inline-block">
                                <a value="1" class="active">42区</a>
                                <a value="2" >段子</a>
                                <a value="3" >图片</a>
                                <a value="4" >挨踢1024</a>
                                <a value="5" >你问我答</a>
                            </div>
                        </div>
                        <div class="f4">
                            <a class="submit right" id="submit_link">提交</a>
                            <span class="error-msg right"></span>
                        </div>
                    </div>
                    <div content="2" class="publish-content clearfix hide">
                        <div class="f2">
                            <textarea name="title"></textarea>
                        </div>
                        <div class="f3">

                            <span>发布到：</span>
                            <div class="news-type" style="display: inline-block">
                                <a value="2" class="active">段子</a>
                                <a value="5">你问我答</a>
                            </div>
                        </div>
                        <div class="f4">
                            <a class="submit right" id="submit_text">提交</a>
                            <span class="error-msg right"></span>
                        </div>
                    </div>
                    <div content="3" class="publish-content clearfix hide">
                        <div class="tab-alt">添加图片</div>
                        <div class="f5">
                            <form style="display: inline-block" id="upload_img_form" name="form" action="/upload_image/" method="POST"  enctype="multipart/form-data" >
                                <a id="fakeFile" class="fake-file">
                                    <span>上传图片</span>
                                    <input type="file" name="img" onchange="UploadImage(this);"/>
                                    <input type="text" name="url" class="hide" />
                                </a>
                                <iframe id='upload_img_iframe' name='upload_img_iframe' src=""  class="hide"></iframe>
                            </form>
                            <a href="javascript:void(0);" class="re-upload hide" id="reUploadImage" onclick="ReUploadImage(this);">重新上传</a>
                        </div>
                        <div class="f2" style="margin-top: 8px">
                            <textarea name="title" placeholder="请输入描述"></textarea>
                        </div>
                        <div class="f3">
                            <span>发布到：</span>
                            <div class="news-type" style="display: inline-block">
                                <a value="3" class="active">图片</a>
                                <a value="5">你问我答</a>
                            </div>
                        </div>
                        <div class="f4">
                            <a class="submit right" id="submit_img">提交</a>
                            <span class="error-msg right"></span>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>

    <div id="accountDialog" class="account-dialog hide clearfix">
        <div id="model_login" class="login left">
            <div class="header">登陆</div>
            <div class="content">
                <div style="padding: 0 70px">
                    <div class="tips">
                        <span>用户名登陆</span>
                        <span style="padding: 0 5px;">|</span>
                        <span>邮箱登陆</span>
                    </div>
                    <div id="login_error_summary" class="error-msg">

                    </div>
                    <div class="inp">
                        <input name="user" type="text" placeholder="请输入用户名或邮箱" />
                    </div>
                    <div class="inp">
                        <input name="pwd" type="password" placeholder="请输入密码" />
                    </div>
                    <div class="inp clearfix">
                        <input name="code" class="check-code" type="text" placeholder="请输入验证码" />
                        <span>
                            <img class="check-img" src="/check_code/" alt="验证码" onclick="ChangeCode(this);">
                        </span>

                    </div>
                    <div class="extra">
                        <input type="checkbox" name="autoLogin" checked="checked" /> <span>一个月内自动登录</span>
                        <a class="right" href="javascript:void(0);">忘记密码？</a>
                    </div>
                    <div class="inp">
                        <div class="submit" onclick="SubmitLogin(this);">
                            <span>登陆</span>
                            <span class="hide">
                                <img src="/statics/images/loader.gif" style="height: 16px; 16px">
                                <span>正在登陆</span>
                            </span>
                        </div>
                    </div>
                </div>
                <script>
                    function ChangeCode(ths) {
                        ths.src += '?';
                    }
                </script>
            </div>
        </div>
        <div id="model_register" class="register left">
            <div class="header">
                <span>注册</span>
                <div class="dialog-close" onclick="CloseDialog('#accountDialog');">X</div>
            </div>
            <div class="content">
                <div style="padding: 0 70px">
                    <div class="tips">
                        <span>输入注册信息</span>
                    </div>
                    <div id="register_error_summary" class="error-msg">

                    </div>
                    <div class="inp">
                        <input name="username" type="text" placeholder="请输入用户名" />

                    </div>
                    <div class="inp">
                        <input name="email" id="email" type="text" placeholder="请输入邮箱" />
                    </div>
                    <div class="inp">
                        <input name="email_code" class="email-code" type="text" placeholder="请输入邮箱验证码" />
                        <a id="fetch_code" class="fetch-code" href="javascript:void(0);">获取验证码</a>
                    </div>
                    <div class="inp">
                        <input name="password" type="password" placeholder="请输入密码" />
                    </div>
                    <div class="inp">
                        <div class="submit" onclick="SubmitRegister(this);">
                            <span>注册</span>
                            <span class="hide">
                                <img src="/statics/images/loader.gif" style="height: 16px; 16px">
                                <span>正在注册</span>
                            </span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endblock %}

{% block javascript %}
    <script type="text/javascript" src="/statics/plugins/tab-menu-box/tab.js"></script>
    <script type="text/javascript">
        $(function () {
            BindTabMenu('#tab-menu-title', '#tab-menu-body');

            BindLoginRegisterDialog();

            BindPublishDialog();

            BindSendMsg();

            BindNewType();

            BindPublishSubmit();
        });

        function BindPublishSubmit(){
            $('#submit_link,#submit_text,#submit_img').click(function(){
                // 获取输入内容并提交
                var container = $(this).parent().parent();
                var post_dict = {};
                container.find('input[type="text"],textarea').each(function(){
                    post_dict[$(this).attr('name')] =$(this).val();
                });
                post_dict['news_type_id'] = container.find('.news-type .active').attr('value');

                $.ajax({
                    url: '/index/',
                    type: 'POST',
                    data: post_dict,
                    dataType: 'json',
                    success: function (arg) {
                        if(arg.status){
                            window.location.href = '/index';
                        }else{
                            console.log(arg);
                        }
                    }
                    
                })


            });
        }

        function BindNewType(){
            $('.news-type').children().click(function(){
                $(this).addClass('active').siblings().removeClass('active');
            });
        }

        function BindSendMsg(){
            $("#fetch_code").click(function(){
                $('#register_error_summary').empty();
                var email = $('#email').val();
                if(email.trim().length == 0){
                    $('#register_error_summary').text('请输入注册邮箱');
                    return;
                }
                if($(this).hasClass('sending')){
                    return;
                }
                var ths = $(this);
                var time = 60;

                $.ajax({
                    url: "/send_msg/",
                    type: 'POST',
                    data: {email: email},
                    dataType: 'json',
                    success: function(arg){
                        if(!arg.status){
                            $('#register_error_summary').text(arg.summary);
                        }else{
                            ths.addClass('sending');
                            var interval = setInterval(function(){
                            ths.text("已发送(" + time + ")");
                            time -= 1;
                            if(time <= 0){
                                clearInterval(interval);
                                ths.removeClass('sending');
                                ths.text("获取验证码");
                            }
                        }, 1000);
                        }
                    }
                });

            });
        }

        function BindLoginRegisterDialog(){

            $('#reg_link_a,#login_link_a').click(function(){
                $('#accountDialog').removeClass('hide');
                $('.shadow').removeClass('hide');
            });
        }

        function BindPublishDialog(){

            $('#publishBtn').click(function(){
                if($('#action_nav').attr('is-login') == 'true'){
                    $('#publishDialog').removeClass('hide');
                }else{
                    $('#accountDialog').removeClass('hide');
                }

                $('.shadow').removeClass('hide');
            });

        }

        function CloseDialog(dialog){
            $(dialog).addClass('hide');
            $('.shadow').addClass('hide');
        }

        window.onkeydown = function(event){
            if(event && event.keyCode == 27){
                $('.dialog,.account-dialog,.shadow').addClass('hide');
            }
        };

        /*
        上传图片
        */
        function UploadImage(ths){
            document.getElementById('upload_img_iframe').onload = UploadImageComplete;
            document.getElementById('upload_img_form').target = 'upload_img_iframe';
            document.getElementById('upload_img_form').submit();
        }

        /*
        上传图片之后回掉函数
        */
        function UploadImageComplete(){
            var origin = $("#upload_img_iframe").contents().find("body").text();
            var obj = JSON.parse(origin);
            if(obj.status){
                var img = document.createElement('img');
                img.src = '/' + obj.data;
                img.style.width = "200px";
                img.style.height = "180px";
                $("#upload_img_form").append(img);
                $('#fakeFile').addClass('hide');
                $('#reUploadImage').removeClass('hide');
                $('#fakeFile').find('input[type="text"]').val(obj.data);
            }else{
                alert(obj.summary);
            }
        }

        /*
        重新上传图片
        */
        function ReUploadImage(ths){
            $(ths).addClass('hide');
            $("#upload_img_form").find('img').remove();
            $('#fakeFile').removeClass('hide');
        }

        /*
        点击登陆按钮
        */
        function SubmitLogin(ths){
            $(ths).children(':eq(0)').addClass('hide');
            $(ths).addClass('not-allow').children(':eq(1)').removeClass('hide');
            // 发送Ajax请求
            //完成之后
            $('#model_login .inp .error').remove();

            var post_dict = {};
            $('#model_login input').each(function(){
                post_dict[$(this).attr("name")] = $(this).val();
            });

            $.ajax({
                url: '/login/',
                type: 'POST',
                data: post_dict,
                dataType: 'json',
                success: function(arg){
                    if(arg.status){
                        window.location.href = '/index';
                    }else{
                        $.each(arg.message, function(k,v){

                            //<span class="error">s</span>
                            var tag = document.createElement('span');
                            tag.className = 'error';
                            tag.innerText = v[0]['message'];
                            $('#model_login input[name="'+ k +'"]').after(tag);
                        })
                    }
                }
            });

            $(ths).removeClass('not-allow').children(':eq(1)').addClass('hide');
            $(ths).children(':eq(0)').removeClass('hide');
        }

        /*
        点击注册按钮
        */
        function SubmitRegister(ths){
            $('#register_error_summary').empty();
            $('#model_register .inp .error').remove();

            $(ths).children(':eq(0)').addClass('hide');
            $(ths).addClass('not-allow').children(':eq(1)').removeClass('hide');

            var post_dict = {};
            $('#model_register input').each(function(){
                post_dict[$(this).attr("name")] = $(this).val();
            });

            $.ajax({
                url: '/register/',
                type: 'POST',
                data: post_dict,
                dataType: 'json',
                success: function(arg){
                    if(arg.status){
                        window.location.href = '/index';
                    }else{
                        $.each(arg.message, function(k,v){
                            //<span class="error">s</span>
                            var tag = document.createElement('span');
                            tag.className = 'error';
                            tag.innerText = v[0]['message'];
                            $('#model_register input[name="'+ k +'"]').after(tag);
                        })
                    }
                }
            });

            $(ths).removeClass('not-allow').children(':eq(1)').addClass('hide');
            $(ths).children(':eq(0)').removeClass('hide');
        }

        /*
        显示或隐藏评论区
         */
        function ToggleCommentArea(nid){
            var $comment_area = $("#comment_area_" + nid);
            if($comment_area.hasClass('hide')){
                $comment_area.removeClass('hide');
                var $comment_list = $("#comment_list_" + nid);
                $.ajax({
                    url: '/comment_tit/',
                    type: 'GET',
                    data: {nid: nid},
                    success: function(arg){
                        $comment_list.empty();
                        $comment_list.append(arg);
                        var $loading = $comment_area.find('.comment-box').children().first();
                        $loading.addClass('hide');
                        $loading.siblings().removeClass('hide');
                    }
                })
            }else{
                $comment_area.addClass('hide');
            }
        }

        /*
        隐藏评论区
         */
        function HideCommentArea(nid){
            $("#comment_area_" + nid).addClass('hide');
        }

        /*
        发布评论
         */
        function DoComment(nid){
            var content = $("#comment_content_"+nid).val();
            var reply_id = $("#reply_id_"+nid).attr('target');
            var device = navigator.appVersion;

            if($('#action_nav').attr('is-login') == 'true'){
                $.ajax({
                    url: '/comment/',
                    type: 'POST',
                    data: {content: content, reply_id:reply_id, news_id: nid, device: device},
                    dataType: 'json',
                    success: function(arg){
                        // 获取评论信息，将内容添加到指定位置
                        console.log(arg);
                        if(arg.status){
                            $('#comment_content_' + arg.data.news_id).val('');
                            var a = '<ul><li class="items" style="padding:8px 0 0 16px;"><span class="folder" id="comment_folder_';
                            var b = arg.data.nid;
                            var c = '"><div class="comment-L comment-L-top"><a href="#" class="icons zhan-ico"></a><a href="/user/moyujian/submitted/1"><img src="/statics/images/1.jpg"></a></div><div class="comment-R comment-R-top" style="background-color: rgb(246, 246, 246);"><div class="pp"><a class="name" href="/user/moyujian/submitted/1">';
                            var d = arg.data.user_info__username;
                            var e = '</a><span class="p3">';
                            var f = arg.data.content;
                            var g= '</span><span class="into-time into-time-top">';
                            var h = arg.data.ctime;
                            var i = '</span></div><div class="comment-line-top"><div class="comment-state"><a class="ding" href="javascript:void(0);"><b>顶</b><span class="ding-num">[0]</span></a><a class="cai" href="javascript:void(0);"><b>踩</b><span class="cai-num">[0]</span></a><span class="line-huifu">|</span> <a class="see-a jubao" href="javascript:void(0);">举报</a> <span class="line-huifu">|</span> <a class="see-a huifu-a" href="javascript:void(0);" onclick="';
                            var j = "reply(" + arg.data.news_id + "," +arg.data.nid+",'"+arg.data.username+"')";
                            var k = '">回复</a></div></div></div></span></li></ul>';
                            var tag = a+b+c+d+e+f+g+h+i+j+k;
                            console.log(arg,tag);
                            var $commentCount = $('#comment_count_'+nid);
                            var cc = parseInt($commentCount.text());
                            $commentCount.text(cc + 1);
                            if(arg.data.reply_id){
                                $comment_folder = $('#comment_folder_' + arg.data.reply_id);
                                $comment_folder.after(tag);
                            }else{
                                $('#comment_list_'+arg.data.news_id).append(tag);
                            }


                        }else{
                            alert('error');
                        }
                    }
                })
            }else{
                $('#accountDialog').removeClass('hide');
                $('.shadow').removeClass('hide');
            }
        }

        /*
        点赞
         */
        function DoFavor(ths, nid) {

            if($('#action_nav').attr('is-login') == 'true'){
                $.ajax({
                    url: '/favor/',
                    type: 'POST',
                    data: {news_id: nid},
                    dataType: 'json',
                    success: function(arg){
                        if(arg.status){
                            var $favorCount = $('#favor_count_'+nid);
                            var c = parseInt($favorCount.text());
                            if(arg.code == 2301){
                                $favorCount.text(c + 1);
                                $(ths).find('span').addClass('active');
                                AddFavorAnimation(ths);
                            }else if(arg.code == 2302){
                                $favorCount.text(c - 1);
                                $(ths).find('span').removeClass('active');
                                MinusFavorAnimation(ths);
                            }else{

                            }

                        }else{

                        }
                    }
                })
            }else{
                $('#accountDialog').removeClass('hide');
                $('.shadow').removeClass('hide');
            }
        }

        /*
        点赞+1效果
         */
        function AddFavorAnimation(ths){
            var offsetTop = -10;
            var offsetLeft = 20;
            var fontSize = 24;
            var opacity = 1;
            var tag = document.createElement('i');
            tag.innerText = "+1";
            tag.style.position = 'absolute';
            tag.style.top = offsetTop + 'px';
            tag.style.left = offsetLeft + 'px';
            tag.style.fontSize = fontSize + "px";
            tag.style.color = "#5cb85c";
            $(ths).append(tag);

            var addInterval = setInterval(function(){
                    fontSize += 5;
                    offsetTop -= 15;
                    offsetLeft += 5;
                    opacity -= 0.1;
                    tag.style.top = offsetTop+ 'px';
                    tag.style.left = offsetLeft+ 'px';
                    tag.style.fontSize = fontSize + 'px';
                    tag.style.opacity = opacity;
                if(opacity <= 0.5){
                    tag.remove();
                    clearInterval(addInterval);
                }
            },40)
        }

        /*
        点赞-1效果
         */
        function MinusFavorAnimation(ths){
            var offsetTop = -10;
            var offsetLeft = 20;
            var fontSize = 24;
            var opacity = 1;
            var tag = document.createElement('i');
            tag.innerText = "-1";
            tag.style.position = 'absolute';
            tag.style.top = offsetTop + 'px';
            tag.style.left = offsetLeft + 'px';
            tag.style.fontSize = fontSize + "px";
            tag.style.color = "#787878";
            $(ths).append(tag);

            var addInterval = setInterval(function(){
                    fontSize += 5;
                    offsetTop -= 15;
                    offsetLeft += 5 ;
                    opacity -= 0.1;
                    tag.style.top = offsetTop+ 'px';
                    tag.style.left = offsetLeft+ 'px';
                    tag.style.fontSize = fontSize + 'px';
                    tag.style.opacity = opacity;
                if(opacity <= 0.5){
                    tag.remove();
                    clearInterval(addInterval);
                }
            },40)
        }

        /**
         * 回复评论
         * @param news_id
         * @param comment_id
         * @param username
         */
        function reply(news_id, comment_id, username){
            var $reply = $('#reply_id_' + news_id);
            $reply.attr('target', comment_id);
            $reply.text(username);
            $reply.parent().css('display','block');
        }
    </script>
{% endblock %}
index

   
        
作业：
    1、评论
        - 单级评论
        - 多级评论
        
        ---- 必须交
        
        
    2、预习Tornado
        Torando + SQLAchemy
        pip3 install tornado
        http://www.tornadoweb.cn
        
        
        
官网实例：
    瀑布流
    组合搜索    
   

【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/aaron-shen/p/5948445.html