FormData对象

最新推荐文章于 2024-08-15 21:17:34 发布

她还会来吗

最新推荐文章于 2024-08-15 21:17:34 发布

阅读量160

点赞数 1

分类专栏： Ajax

本文链接：https://blog.csdn.net/m0_53895172/article/details/114396124

版权

本文介绍了如何使用FormData对象进行异步上传二进制文件，并详细讲解了相关方法，如get、set、delete和append，以及如何在上传过程中显示进度。服务器端和客户端的代码示例也进行了展示。

摘要由CSDN通过智能技术生成

FormData

作用: 模拟HTML表单，相当于将HTML表单映射成表单对象，自动将表单中的数据拼接成请求参数的格式
异步上传二进制文件
使用:
准备HTML表单
将HTML表单转化为HTML对象
提交表单对象:

创建formidable表单解析对象 const form = new formidable.IncomingForm()
解析客户端传递过来的FormData对象
form.parse(req,(err,fields,files)=>{ res.send(fields); })
客户端代码:

 <form id="form">
        <input type="text" name="usename">
        <input type="password" name="password" id="">
        <input type="button" value="提交" id="btn">
    </form>
    <script>
       var btn = document.querySelector('#btn');
       var form = document.querySelector('#form');
       btn.onclick = function(){
   
        // 利用FormData将html表单转化为表单对象
        var formdata = new FormData(form);
        // 创建Ajax对象
        var xhr = new XMLHttpRequest();
        // 配置Ajax对象
        xhr.