前端contentType數據傳輸格式與ajax技術


    前端數據格式contentType參數
        前后端傳輸數據的編碼格式
            1.urlencoded(form表單與ajax默認的數據提交編碼格式)  
                數據格式 name='jason'&password='123'
                django后端識別到urlencoded數據格式將其處理封裝到了request.POST
            2.formdata  傳輸文件
                支持傳普通鍵值對也可以傳文件
                普通鍵值還是處理放到request.POST中
                文件數據處理放到request.FILES中
            3.application/json(ajax支持)
                JSON.stringify({'name':'jason'})
                django后端對於json格式的數據不做任何處理,就將原生的二進制數據存在request.body中,讓你自己手動處理
                    先解碼再反序列化
            
    局部刷新之ajax
        異步提交(github注冊示例)
        局部刷新
        
        四個基本參數
            url:'',  # 控制數據提交的地址,不寫默認往當前位置提交
            type:'get',  # 控制的是數據的提交方式 get,post,。。。
            data:{'name':'jason'}  # 提交的數據
            success:function(data){
                # 做局部刷新的操作
                alert(data)
            }
        
        $('#b1').click(function(){
            $.ajax({
                url:'',  # 控制數據提交的地址,不寫默認往當前位置提交
                type:'get',  # 控制的是數據的提交方式 get,post,。。。
                contentType:'application/json',
                data:JSON.stringify({'name':'jason'}),  # 提交的數據
                success:function(data){
                    # 做局部刷新的操作
                    alert(data)
                }
            })
        
        
        })
        
        ajax發送文件
            1.利用一個js內置對象FormData
            2.這個FormData即可以傳普通的鍵值也可以傳文件
            3.需要修改兩個默認參數processData,contentType
            4.獲取input框存儲的文件數據$('input[type="file"]')[0].files[0]
        
        $('#b1').click(function(){
            # 先生成一個內置對象
            var formdata = new FormData();
            formdata.append('','');
            formdata.append('myfile',$('input[type="file"]')[0].files[0]);
            $.ajax({
                url:'',  # 控制數據提交的地址,不寫默認往當前位置提交
                type:'get',  # 控制的是數據的提交方式 get,post,。。。
                contentType:false,
                processData:false,
                data:JSON.stringify({'name':'jason'}),  # 提交的數據
                success:function(data){
                    # 做局部刷新的操作
                    alert(data)
                }
            })
        
        
        })

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM