12.Django與ajax

Django與ajax

01.AJAX簡介：
　　AJAX（Asynchronous Javascript And XML）翻譯成中文就是「異步Javascript和XML」。

　　　　*同步交互：客戶端發出一個請求後，須要等待服務器響應結束後，才能發出第二個請求
　　　　*異步交互：客戶端發出一個請求後，無需等待服務器響應結束，就能夠發出第二個請求
　　　　*AJAX除了異步的特色外，還有一個就是：瀏覽器頁面局部刷新

　　優勢：
　　　　AJAX使用Javascript技術向服務器發送異步請求
　　　　AJAX無須刷新整個頁面

02.ajax發送json數據

 1 //發送json數據  2 $('.btn').click(function () {  3  4 $.ajax({  5 url:"",  6 type:"post",  7 contentType:"application/json",//默認的contentType都爲urlencoded  8 data:JSON.stringify({//至關於python中json.dumps  9 a:1, 10 b:2 11 }), 12 success:function (data) { 13 14 } 15 }) 16 })

 

03.ajax上傳文件

 1 <form>  2 用戶名 <input type="text" id="user">  3 頭像 <input type="file" id="avatar">  4 <input type="button" id="ajax-submit" value="ajax-submit">  5 </form>  6  7 <script>  8 $("#ajax-submit").click(function(){  9 //獲取文件固定格式 10 var formdata=new FormData(); 11 formdata.append("user",$("#user").val()); 12 formdata.append("avatar_img",$("#avatar")[0].files[0]);//JS取得文件先轉換爲dom對象，再經過.files[0]獲取 13 $.ajax({ 14 15 url:"", 16 type:"post", 17 data:formdata, 18 //上傳文件必寫這兩行！！！ 19 processData: false , // 不處理數據 20 contentType: false, // 不設置內容類型 21 22 success:function(data){ 23 console.log(data) 24 } 25 }) 26 }) 27 </script>