Django中使用jquery的创建交互式、快速动态网页应用的网页开发技术进行数据交互的实例代码

jquery框架中提供了$.Ajax，美元.获得、$美元。邮政方法，用于进行异步交互，由于Django中默认使用CSRF约束，推荐使用$.得到

示例：实现省市区的选择

最终实现效果如图：

将jquery文件拷贝到静态/js/目录下

打开书籍测试/查看。巴拉圭文件，定义视图区域1,用于显示下拉列表

#提供显示下拉列表的控件，供用户操作def area1(请求):返回渲染（请求，' booktest/area 1。html’)打开booktest/URL。巴拉圭文件，配置全球资源定位器(统一资源定位符)

url('^area1/$',views.area1)，在模板/booktest/目录下创建area1.html

！DOCTYPE html html lang=' en ' head meta charset=' UTF-8 ' title title/title script src=' http :/static/js/jquery-1。12 .4 .量滴js '/script script $(function(){ $ .get('/sheng/'，function(data){//{ slist :[]} var slist=data。slist//[{},{},{}.]var sheng=$(' # sheng ')；$.每个(slist，function (i，n) { //n=={id:title : } sheng。追加('选项值=' n . id ' ' ' n . title '/option ')})；});$('声').change(function(){ var sid=$(this)).val()；如果（希德！='0'){ $.get('/shi/'，{'sid':sid}，function(data){ var slist=data。slistvar shi=$('#shi ').空()。追加('选项值='0 '请选择/option ')；$('#qu ').空()。追加('选项值='0 '请选择/option ')；$.每个(列表，函数(I，n){ Shi。追加('选项值=' n . id ' ' ' n . title '/option ')；});});} });$('#shi ').change(function(){ var sid=$(this)).val()；如果（希德！='0'){ $.get('/shi/'，{'sid':sid}，function(data){ var slist=data。slistvar shi=$('#qu ').空()。追加('选项值='0 '请选择/option ')；$.每个(列表，函数(I，n){ Shi。追加('选项值=' n . id ' ' ' n . title '/option ')；});});} });});/script/head dysel id=' sheng '选项值='0 '请选择/option/selectselect id='shi '选项值='0 '请选择/option/selectselect id='qu '选项值='0 '请选择/选项/选择/正文/html运行服务器，在浏览器中输入如下网址

http://127.0.0.1:8000/area1/

浏览效果如下图

打开书籍测试/查看。巴拉圭文件，定义视图盛，用于获取省信息

url('^sheng/$',views.sheng),

从django.http导入JsonResponsedef sheng(请求): slist=areinfo。物体。筛选器(aParent _ _为null=True)' '[{ id :title:}，{}，{ }]' ' ' slist 2=[]用于slist : slist 2中的s。追加({ ' id ' :s。id，' title':s.atitle})返回JsonResponse({ ' slist ' 3:s)打开booktest/URL。巴拉圭文件，配置全球资源定位器(统一资源定位符)

url('^sheng/$',views.sheng)，在浏览器中输入如下网址

http://127.0.0.1:8000/sheng/浏览效果如下图

打开书籍测试/查看。巴拉圭文件，定义视图施，用于根据编号获取对应的子级信息，如果传递的是省编号则获取市信息，如果传递的是市编号则获取区县信息

#根据pid查询子级区域信息def shi(请求): sid=请求去吧。get(' sid ')slist=areinfo。物体。slist : slist 2中的s的筛选器(aParent _ id=sid)slist 2=[]。追加({ ' id ' :s。id，' title':s.atitle})返回JsonResponse({ ' slist ' :s列表2 })打开booktest/URL。巴拉圭文件，配置全球资源定位器(统一资源定位符)

url('^shi/$',views.shi)，在浏览器中输入如下网址

http://127.0.0.1:8000/shi/？sid=140000/浏览效果如下图

在浏览器中输入如下网址

http://127.0.0.1:8000/shi/

选择效果如下图

总结

以上所述是小编给大家介绍的Django中使用jquery的创建交互式、快速动态网页应用的网页开发技术进行数据交互的实例代码，希望对大家有所帮助！