【Django 2021年最新版教程18】jquery ajax实例 json

本文主要是介绍【Django 2021年最新版教程18】jquery ajax实例 json，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

 

一、前端html

    将如下的表单数据a和b发送给服务器，服务器端的django接收数据并计算a+b的结果，并以json格式附在response文件上返回回来。

   前端接收到返回的结果后，在不刷新页面的情况下，将结果显示出来。

<form>a: <input type="text" id="a" name="a"> <br>b: <input type="text" id="b" name="b"> <br><p>result: <span id='result'></span></p><button type="button" id='sum'>ajax提交</button>
</form>

 

 

 

二、前端js

    <!--记得引入jquery.js-->    <script>$(document).ready(function(){$("#sum").click(function(){var a = $("#a").val();var b = $("#b").val();$.ajax({type:"POST",url:"/ajax/add/",data:{"a":a, "b":b},datatype:"json",success: function(ret){$('#result').html(ret.result)},//调用出错执行的函数error: function(){//请求出错处理}     })});});</script>

 

三、后端

由于django中对post增加了csrf的保护，所以其views.py的响应函数需要加上@csrf_exempt装饰器，具体如下：

from django.views.decorators.csrf import csrf_exempt@csrf_exempt
def ajax_test_add(request):a = int(request.POST.get('a'))b = int(request.POST.get('b'))return_json = {'result':a+b}return HttpResponse(json.dumps(return_json), content_type='application/json')

 

 

 

 

参考：https://blog.csdn.net/autoliuweijie/article/details/50291357

这篇关于【Django 2021年最新版教程18】jquery ajax实例 json的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---