Django Ajax的使用教程

2024-09-01 08:30:45

字體：大中小

來源：轉(zhuǎn)載

供稿：網(wǎng)友

簡(jiǎn)介：

AJAX = Asynchronous JavaScript and XML（異步的 JavaScript 和 XML）。

AJAX 不是新的編程語言，而是一種使用現(xiàn)有標(biāo)準(zhǔn)的新方法。

AJAX 是與服務(wù)器交換數(shù)據(jù)并更新部分網(wǎng)頁的藝術(shù)，在不重新加載整個(gè)頁面的情況下。

Ajax

　　很多時(shí)候，我們?cè)诰W(wǎng)頁上請(qǐng)求操作時(shí)，不需要刷新頁面。實(shí)現(xiàn)這種功能的技術(shù)就要Ajax！

jQuery中的ajax就可以實(shí)現(xiàn)不刷新頁面就能向后臺(tái)請(qǐng)求或提交數(shù)據(jù)的功能，現(xiàn)用它來做django中的ajax，所以先把jquey下載下來，版本越高越好。

一、ajax發(fā)送簡(jiǎn)單數(shù)據(jù)類型：

html代碼：在這里我們僅發(fā)送一個(gè)簡(jiǎn)單的字符串

views.py

 #coding:utf8 from django.shortcuts import render,HttpResponse,render_to_response def Ajax(request):   if request.method=='POST':     print request.POST     return HttpResponse('執(zhí)行成功')   else:     return render_to_response('app03/ajax.html')

ajax.html

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ajax</title> </head> <body>   <input id='name' type='text' />   <input type='button' value='點(diǎn)擊執(zhí)行Ajax請(qǐng)求' onclick='DoAjax()' />   <script src='/static/jquery/jquery-3.2.1.js'></script>   <script type='text/javascript'>   function DoAjax(){     var temp = $('#name').val();     $.ajax({       url:'app03/ajax/',       type:'POST',       data:{data:temp},       success:function(arg){         console.log(arg);       },       error:function(){         console.log('failed')       }     });   }   </script> </html>

運(yùn)行，結(jié)果：

二、ajax發(fā)送復(fù)雜的數(shù)據(jù)類型：

html代碼：在這里僅發(fā)送一個(gè)列表中包含字典數(shù)據(jù)類型

由于發(fā)送的數(shù)據(jù)類型為列表字典的格式，我們提前要把它們轉(zhuǎn)換成字符串形式，否則后臺(tái)程序接收到的數(shù)據(jù)格式不是我們想要的類型，所以在ajax傳輸數(shù)據(jù)時(shí)需要JSON

<!DOCTYPE html> <html> <head> <meta charset="UTF-"> <title>Ajax</title> </head> <body>   <input id='name' type='text' />   <input type='button' value='點(diǎn)擊執(zhí)行Ajax請(qǐng)求' onclick='DoAjax()' />   <script src='/static/jquery/jquery-3.2.1.js'></script>   <script type='text/javascript'>   function DoAjax(){     var temp = $('#name').val();     $.ajax({       url:'app03/ajax/',       type:'POST',       data:{data:temp},       success:function(arg){         var obj=jQuery.parseJSON(arg);         console.log(obj.status);         console.log(obj.msg);         console.log(obj.data);         $('#name').val(obj.msg);       },       error:function(){         console.log('failed')       }     });   }   </script> </html>

views.py

 #coding:utf from django.shortcuts import render,HttpResponse,render_to_response import json # Create your views here. def Ajax(request):   if request.method=='POST':     print request.POST     data = {'status':,'msg':'請(qǐng)求成功','data':['','','']}     return HttpResponse(json.dumps(data))   else:     return render_to_response('app/ajax.html')

打印數(shù)據(jù)樣式：