AJAX
AJAX是前端技术的集合，包括JavaScript、XML、HTML、CSS等。
AJAX的作用
提升用户体验。
JQuery
JQuery是一个兼容多种浏览器的JavaScript库。
JQuery的作用
JQuery简化JavaScript的使用，同理，简化AJAX的使用。
在线链接
Django版本：3.0.6
JQuery版本：1.12.4
AJAX的使用方法
urls.py
from django.urls import path
import Public.views
urlpatterns = [
path('error/',Public.views.error),
]
views.py
from django.http import HttpResponse, request, response
from django.shortcuts import redirect, render, resolve_url
def error(request):
if request.method == 'POST':
num1 = request.POST.get('num1',0)
num2 = request.POST.get('num2',0)
num = int(num1)+int(num2)
return HttpResponse(str(num)) #POST请求仅返回HttpResponse值
return render(request, 'error.html') #GET请求返回error.html界面
error.html #使用error界面进行测试
error
+
=
{% csrf_token %}
输出效果：输入2+2，点击计算，异步计算结果为4并返回前端
X3倍后代码
urls.py
from django.urls import path
import Public.views
urlpatterns = [
path('error/',Public.views.error),
]
views.py
from django.http import HttpResponse, request, response
from django.shortcuts import redirect, render, resolve_url
def error(request):
if request.method == 'POST':
num1 = request.POST.get('num1',0)
num2 = request.POST.get('num2',0)
num = int(num1)+int(num2)
return HttpResponse(str(num)) #POST请求仅返回HttpResponse值
return render(request, 'error.html') #GET请求返回error.html界面
error.html #使用error界面进行测试
error
+
=
+
=
+
=
{% csrf_token %}
输出效果：分别输入三组数值，点击不同的计算，异步计算结果后根据点击的计算返回前端
for循环后代码
urls.py
from django.urls import path
import Public.views
urlpatterns = [
path('error/',Public.views.error),
]
views.py
from django.http import HttpResponse, request, response
from django.shortcuts import redirect, render, resolve_url
def error(request):
if request.method == 'POST':
num1 = request.POST.get('num1',0)
num2 = request.POST.get('num2',0)
num = int(num1)+int(num2)
return HttpResponse(str(num)) #POST请求仅返回HttpResponse值
return render(request, 'error.html') #GET请求返回error.html界面
error.html #使用error界面进行测试
error
{% for i in '369'|make_list %}
+
=
{% endfor %}
{% csrf_token %}
输出效果：分别输入三组数值，点击不同的计算，异步计算结果后根据点击的计算返回前端
输入完成后单数据提交代码
urls.py
from django.urls import path
import Public.views
urlpatterns = [
path('error/',Public.views.error),
]
views.py
def error(request):
if request.method == 'POST':
num1 = request.POST.get('num1',0)
num2 = request.POST.get('num2',0)
num = int(num1)+int(num2)
return HttpResponse(str(num)) #POST请求仅返回HttpResponse值
return render(request, 'error.html') #GET请求返回error.html界面
error.html #使用error界面进行测试
error
{% for i in '369'|make_list %}
+
=
{% endfor %}
{% csrf_token %}
输出效果：值输到哪里，哪里就会显示出结果，无须点击计算按钮
最后把计算按钮隐藏一下
本来还想做一下一键全部提交代码、输入完成后全数据提交代码两个功能，但发现这样要提交的post值太多了，还是一次提交单个或单行数据比较靠谱
参考链接：
- https://www.cnblogs.com/yangyi215/p/14964897.html
- https://www.cnblogs.com/oldpai/p/9637774.html
总结
到此这篇关于Django中使用AJAX的文章就介绍到这了,更多相关Django使用AJAX内容请搜索IT俱乐部以前的文章或继续浏览下面的相关文章希望大家以后多多支持IT俱乐部！
