jquery的ajax发送文件

ajax的post() 方法通过 HTTP POST 请求从服务器载入数据。

语法
jQuery.post(url,data,success(data, textStatus, jqXHR),dataType)

引用jquery：

<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>

发送文件到后端的代码及注释如下：

<p>username:<input type="text" id="d1"></p>
<p>password:<input type="text" id="d2"></p>
<p><input type="file" id="d3"></p>
<button class="btn btn-info" id="d4">点击</button>

<script>
    //点击按钮朝后端发送普通键值对和文件数据
    $('#d4').on('click',function (){
    
    
        //1.需要先利用FormData内置对象
        let formDateObj = new FormData();
        //2.添加普通键值对
        formDateObj.append('username',$('#d1').val());
        formDateObj.append('password',$('#d2').val());
        //3.添加文件对象
        formDateObj.append('myfile',$('#d3')[0].files[0])
        //4.将对象基于ajax发送给后端
        $.ajax({
    
    
            url:'',
            type:'post',
            data:formDateObj,  //直接将对象放在data后面

            //ajax发送文件必须要指定两个参数
            contentType:false,  //不要使用任何编码，django后端能够自动识别formdata对象
            processData:false,  //告诉浏览器不要对你的数据进行任何处理

            success:function (args) {
    
    

            }
        })

    })
</script>