这一篇教程，我们结合JQuery完成Django2个人博客系统的发布评论的功能。
如果要发布评论，我们需要先定义一个发布评论的视图函数。
在这个视图函数中，将请求中的数据通过模型存储到数据库。
这里要注意，评论的所属文章和回复的目标评论都不是用户填写的表单内容，而是需要通过请求中的相关参数查询到数据对象添加到评论对象中，再将评论对象和用户提交的表单数据结合到一起创建表单数据对象进行校验与保存。
示例代码：
from django.shortcuts import HttpResponse from .forms import CommentForm
def pub_comment(request): # 发布评论函数
if request.method == 'POST': # 如果是post请求
comment = Comment() # 创建评论对象
comment.article = Article.objects.get(id=request.POST.get('article')) # 设置评论所属的文章
if request.POST.get('reply') != '0': # 如果回复的不是文章而是他人评论
comment.reply = Comment.objects.get(id=request.POST.get('reply')) # 设置回复的目标评论
form = CommentForm(request.POST, instance=comment) # 将用户的输入和评论对象结合为完整的表单数据对象
if form.is_valid(): # 如果表单数据校验有效
try:
form.save() # 将表单数据存入数据库
result = '200' # 提交结果为成功编码
except: # 如果发生异常
result = '100' # 提交结果为失败编码
else: # 如果表单数据校验无效
result = '100' # 提交结果为失败编码
return HttpResponse(result) # 返回提交结果到页面
else: # 如果不是post请求
return HttpResponse('非法请求！') # 返回提交结果到页面
接下来，我们添加URL配置。
示例代码：
path('comment/', blog_view.pub_comment, name='comment'),
最后，我们来完成模板内容。
首先，在我们之前已经完成的模板内容中，评论内容后方“[回复]”的元素属性中都包含了如下属性：
onclick="reply('{{ comment.name }}',{{ comment.id }})
这个属性指定了当“[回复]”被点击时执行“reply()”函数。
所以，我们需要在模板内容中添加一个“reply()”函数，它的作用是点击“[回复]”时记录回复目标的id以及在评论内容输入框中显示被回复的评论人。
示例代码：
<script>
function reply(comment_name, comment_id) {
$('#content').attr('placeholder', '回复' + comment_name + '的内容：'); // 设置内容输入框的提示
$('#reply').val(comment_id) //设置隐藏元素的值为评论目标的id
}
</script>
在上方代码中，通过“$(‘#元素id)”对元素的属性值进行了更改，当点击“[回复]”的时候就能够呈现我们需要的效果。
然后，我们继续添加回复按钮的函数。
点击回复按钮时，我们做一个简单的非空验证，如果所有内容均已填入，我们将内容提交，否则给出检查输入内容的提示。
当内容正常提交之后，还要根据返回的结果给出“评论成功”或者“评论失败”的提示。
另外，这里还要注意一点，我们的评论表单并不是放在了一对“<form>…</form>”标签中，所以，没有添加防止跨域攻击的代码。
这会导致提交评论时发生异常。
我们在编写Javascript代码的时候，需要添加防止跨域攻击的代码。
示例代码：
<script>
$(document).ready(function () {
$('#submit_comment').click(function () { // 定义回复按钮点击时调用的函数
$.ajaxSetup({ // 添加防止跨域攻击的代码
data: {csrfmiddlewaretoken: '{{ csrf_token }}'}
});
var reply = $('#reply').val(); // 将评论目标id存入变量
var name = $('#name').val(); // 将评论人昵称存入变量
var email = $('#email').val(); // 将评论人邮箱地址存入变量
var content = $('#content').val(); // 将评论内容存入变量
if (name && email && content) { // 如果所有内容都已填写
$.post('{% url 'comment' %}', { // 用post方法提交请求
'article': {{ article.id }}, // 请求中包含的参数字典
'reply': reply,
'name': name,
'email': email,
'content': content
}, function (result) { // 回调函数获取返回结果
if (result === '200') { // 如果返回评论成功编码
$('#comment_message').css({color: "green"}).html('评论成功！'); // 设置提示元素的样式与文字
} else {
$('#comment_message').css({color: "red"}).html('评论失败！');
}
});
$('#comment_message').removeAttr('hidden'); // 去除提示元素的隐藏属性将提示显示在页面
setTimeout(function () { // 设置超时后执行的函数
location.reload() // 重载页面内容
}, 1000); // 设置超时时长
} else { // 如果不是所有内容都已填写
$('#comment_message').removeAttr('hidden').html('请检查填写的内容！').css({color: "red"});
// 去除提示元素的隐藏属性将提示显示在页面，同时设置提示的样式与文字
}
});
});
</script>
到这里我们就完成发表评论的功能。
转载请注明：魔力Python » Django2练习项目：开发个人博客系统（10）
