2分钟学会ajax 入门ajax必备
聲明:ajax需要有一定的HTML 和js、jsquery基礎(chǔ)
這里是基于python3和django2.1.8實(shí)現(xiàn)的ajax例子
?原理圖:
?
原理解釋:
1.前端向后端發(fā)送ajax請(qǐng)求:
必須寫出你要請(qǐng)求的地址,請(qǐng)求的方式,請(qǐng)求的數(shù)據(jù)類型,這里一般為json格式
2.django后端對(duì)前端發(fā)起的請(qǐng)求進(jìn)行處理返回一個(gè)JsonResponse對(duì)象,數(shù)據(jù)格式為字典這里的處理函數(shù)要和1中的請(qǐng)求地址保持一致
3.前端執(zhí)行回調(diào)函數(shù),當(dāng)獲取到后端傳過(guò)來(lái)的順序之后進(jìn)行最后的處理。
下面是詳細(xì)步驟:
1. Html文件中引入jquery靜態(tài)文件
這里靜態(tài)文件的引入可以查看我以前的博客,相信大家應(yīng)該都會(huì)
{% load static %} <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title>{#1.引入jquery靜態(tài)文件#} <script src="{% static 'js/jquery-1.12.4.min.js'%}"></script>
2. 在html中尋找ajax需要綁定事件的對(duì)象
首先我們看看測(cè)試的html文件中body中的內(nèi)容
<body> <input type="button" id="obj" value="ajax請(qǐng)求提交"> </body>我們準(zhǔn)備將這個(gè)按鈕綁定給ajax
$(function () {{#綁定ajax事件#}$("#obj").click(function () {$.ajax({'url':'/user/ajax_handle', #這里是請(qǐng)求的方法的地址'dataType':'json',}).success(function (data) { #這里一定要傳入?yún)?shù)data//進(jìn)行處理\{#alert(data.res)#}if (data.res == 1){}alert(data.res)})})})</script>
格式如上圖
我們看看view的視圖函數(shù)同時(shí)各位記得配置一下路由就ok了
?
?
?問(wèn)題:
如上操作會(huì)報(bào)錯(cuò)403錯(cuò)誤:
解決方案如下:
在views.py中引入如下 from django.views.decorators.csrf import csrf_exempt,csrf_protect 如下 在views.py里定義的函數(shù)加上裝飾器@csrf_exempt def ajax_test(request):return render(request,'ajax_test.html')@csrf_exempt def ajax_handle(request):return JsonResponse({'res':1})#這樣就ok了
?
轉(zhuǎn)載于:https://www.cnblogs.com/pythonyeyu/p/11341358.html
與50位技術(shù)專家面對(duì)面20年技術(shù)見證,附贈(zèng)技術(shù)全景圖總結(jié)
以上是生活随笔為你收集整理的2分钟学会ajax 入门ajax必备的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: word 2007 文档中添加文件
- 下一篇: CAS服务下单点登录(服务端与客户端)