标签：字典 fun 字符串 closed ide hasclass cat 字符串类型 eth
1.使用jQuery，当点击点赞或者反对时，就触发设定的事件。
2.事件触发后要反对点击的点赞还是反对，使用hasClass判断具体的class是否存在，如果点赞中的diggit存在结果为真就设定为电站，结果为假就是反对，
3.获取到点赞文章的pk，在js中到的变量不能直接用{{article.pk}},原因是未定义，使用"{{ article.pk }}"
1.设定路由和方法，将点赞和反对，文章发送过去，同时注意csrf保护机制
data={article_id,is_up}
2.在url中添加路由
1.接收到传过来的文章id和认定过的结果is_up，但is_up的类型为‘true‘，需要反序列化
2.得到用户对象 user=request.user
3.设置状态，来标识是第一次来点赞，如果不是第一次，就变换状态response={"state":True}
4.如果是第一次操作，在用户点赞表中添加用户对象，文章id和操作类型，并在文章表中将点赞数据+1
如果不是第一次操作，将状态设置为False，并获取到操作第一次的操作类型
5.数据存在字典中，返回时需要序列化 return JsonResponse(response)
1.响应结果给ajax后，首先判断是否为操作是否为第一次
2.如果操作为第一次，判断是点赞还是踩灭，获取到响应页面上的值，将值加1
3.如果不是第一次提交，判断第一次提交的操作类型，显示相应的提示语
1.location.href = "/login/"
2.在js中改变图片标签的链接： $(this)[0].src += "?";
点赞功能代码
‘‘‘ {% extends ‘base.html‘ %} 继承母板 {% block page-main %} <div class="article-detail"> <h1>{{ article.title }}</h1> <p>{{ article.articledetail.content|safe }}</p> </div> <div id="div_digg"> <div class="diggit action"> <span class="diggnum" id="digg_count">{{ article.up_count }}</span> </div> <div class="buryit action"> <span class="burynum" id="bury_count">{{ article.down_count }}</span> </div> <div class="clear"></div> <div class="diggword" id="digg_tips" style="color: red;"></div> </div> {% endblock %} {% block page_js %} {% csrf_token %} <script> $("#div_digg .action").on("click",function () { //判断是点赞还是踩灭,注意不能是diggnum var is_up=$(this).hasClass("diggit"); console.log(is_up); //获取到文章id 在js中需要加引号 var article_id="{{ article.pk }}"; $.ajax({ url:"/blog/up_down/", type:"post", data:{ "is_up":is_up, "article_id":article_id, "csrfmiddlewaretoken":$("[name=‘csrfmiddlewaretoken‘]").val(), }, success:function(data){ alert(data); //如果为真，说明是第一次操作 //console.log(data.state); 都可以使用 console.log(data["state"]); if(data.state){ if(is_up){ var val=$("#digg_count").text(); //点赞加1 val=parseInt(val)+1; console.log(val); $("#digg_count").text(val); }else{ var val=$("#bury_count").text(); val=parseInt(val)+1; $("#bury_count").text(val); //踩加1 } }else{ var val=66; console.log(val); if(data.first_action){ $("#digg_tips").html("您已经推荐过"); }else { $("#digg_tips").html("您已经反对过"); } } } } ) }) </script> {% endblock %} ‘‘‘
‘‘‘ from django.http import JsonResponse import json from django.db.models import F def up_down(request): if request.method =="POST": rep=json.loads(request.POST.get("is_up")) #传过来的是字符串类型,将‘true‘转换成True article_id=request.POST.get("article_id") print(article_id) print(rep,type(rep)) user=request.user response={"state":True} try: # print("走了") models.ArticleUpDown.objects.create(user=user,article_id=article_id,is_up=rep) models.Article.objects.filter(pk=article_id).update(up_count=F("up_count")+1) # print("第一次") ###当点过赞后，再次点赞后，由于ArticleUpDown表中已经创建过这个用户，因此走except except Exception as e: response["state"]=False response["first_action"]=models.ArticleUpDown.objects.filter(user=user,article_id=article_id).first().is_up # print("第二次") return JsonResponse(response) #response是个字典，要序列化处理 ‘‘‘
标签：字典 fun 字符串 closed ide hasclass cat 字符串类型 eth
原文地址：https://www.cnblogs.com/zgf-666/p/9129555.html
