django ajax 구현 코드는 주석을 제출하고 자동으로 새로 고침 기능을 제공합니다.

亚连
풀어 주다: 2018-05-22 13:54:04
원래의
2594명이 탐색했습니다.

이번 글에서는 django ajax 댓글 제출 및 자동 새로 고침 기능 구현 코드를 주로 소개합니다. 필요하신 분들은 참고하시면 됩니다.

몇번 시도한 끝에 드디어 얻었으니 코드를 올려보겠습니다. (저는 네이티브가 아닌 jQuery의 ajax를 사용합니다.)

js 코드:

<script>
 $(document).ready(function () {
  getcomment();
  $(&#39;.comment-box button&#39;).click(function () {
   var comment_text = $(&#39;.comment-box textarea&#39;).val();
   $.ajax({
    type: &#39;POST&#39;,
    url: &#39;/bbs/article/{{ article_list.id }}/comment/&#39;,
    data: {comment: comment_text},
    success:function (callback) {
     var data = $.parseJSON(callback);
     $(&#39;.callback&#39;).html(data.result);
     if(data.result === &#39;successfully&#39;) {
      getcomment();
     }
    }
   })
  });
 });
 function getcomment() {
  $.ajax({
   type: &#39;GET&#39;,
   url: &#39;/bbs/article/{{ article_list.id }}/get_comment/&#39;,
   success:function (call) {
    var datas = $.parseJSON(call);
    $(&#39;.comment-list&#39;).html(datas.answer);
   }
  })
 }
</script>
로그인 후 복사

전체 텍스트가 로드된 후 getcomment() 함수를 호출하고, 데이터베이스에서 주석을 가져오고, 주석을 제출한 후 다시 getcomment() 함수를 호출합니다.

html 템플릿 자동 새로 고침(부트스트랩 템플릿 사용):

 <p class="row">
   <p class="comment-list" style="margin-left: 10px">
   </p>
  </p>
  <p class="row">
 <article class="col-xs-12">
     <h4>请评论:</h4>
     <p class="comment-box">
      <textarea class="form-control" rows="3"></textarea>
      <span class="callback"></span><button type="submit" class="btn btn-success pull-right" style="max-width: 5px;">评论</button>
     </p>
 </article>
</p>
  <hr>
로그인 후 복사

보기 기능:

@csrf_exempt
def comment(request,article_id):
 if request.method == &#39;POST&#39;:
  comments = request.POST[&#39;comment&#39;]
  if len(comments) < 5:
   result = u&#39;评论数需大于5&#39;
   return HttpResponse(json.dumps({&#39;result&#39;: result}))
  else:
   result = &#39;successfully&#39;
   Comment.objects.create(content= comments, article_id=article_id)
   return HttpResponse(json.dumps({&#39;result&#39;: result}))
로그인 후 복사

댓글을 제출하는 기능입니다. csrf 데코레이터를 추가하는 것을 잊지 마세요.

def get_comment(request, article_id):
 article_list = get_object_or_404(Article, id=article_id)
 comments = article_list.comment_set.all()
 html = &#39;&#39;
 for i in comments:
  ele = &#39;<p class="row"><article class="col-xs-12"><p class="pull-right"><span class="label label-default">作者:&#39; + &#39;i.user&#39; + &#39;</span></p><p>&#39; + i.content + &#39;<ul class="list-inline"><li><a href="#" rel="external nofollow" ></a></li></ul></article></p><hr>&#39;
  html += ele
 return HttpResponse(json.dumps({&#39;answer&#39;: html}))
로그인 후 복사

댓글을 가져오는 기능 배경.

마지막으로 텍스트 영역 값 지우기:

function resettext() {
 $(&#39;.form-control&#39;).val(&#39;&#39;);
}
로그인 후 복사

위 내용은 제가 모든 사람을 위해 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

Ajax 요청 주소 뒤에 임의의 숫자를 추가하면 브라우저 캐싱이 방지되는 이유

IE 브라우저 캐시를 지우는 JS 메서드

브라우저가 Ajax 요청을 기억하고 존재하는 문제 해결 앞으로 가고 뒤로 갈 수 있습니다

위 내용은 django ajax 구현 코드는 주석을 제출하고 자동으로 새로 고침 기능을 제공합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿