前端经验_new FormData

电玩女神 2022-05-21 04:39 531阅读 0赞

FormData 对象的使用：

1.用一些键值对来模拟一系列表单控件：即把form中所有表单元素的name与value组装成一个queryString

2.异步上传二进制文件。

1.FormData对象的操作方法，全部在原型中，自己本身没任何的属性及方法。

1.FormData对象的操作方法，全部在原型中，自己本身没任何的属性及方法。

let formData =newFormData()
    
    formData.append('user','zhang')
    
    获取 formData.get('user')//zhang
    
    删除 formData.append('user').....

2.使用FormData对象发送文件

// 文件元素

var file = document.querySelector('[type=file]');
    
        // 通过FormData将文件转成二进制数据
    
        var formData = new FormData();
    
        // 将文件转二进制
    
        formData.append('upload', file.files[0]);
        $.ajax({
    
        url: 'file.php',
    
        type: 'POST',
    
        data: formdata, // 上传formdata封装的数据
    
        dataType: 'JSON',
    
        cache: false,        // 不缓存
    
        processData: false, // jQuery不要去处理发送的数据
    
        contentType: false,   // jQuery不要去设置Content-Type请求头
        success:function (data) {     //成功回调
    
            console.log(data);
    
        }
    });

2.使用FormData对象发送文件

发表评论取消回复

表情：

评论列表（有 0 条评论，531人围观）

还没有评论，来说两句吧...

相关阅读

相关 new FormData() - FormData对象的作用及用法 (实用，赞）

原文出处：[https://segmentfault.com/a/1190000012327982][https_segmentfault.com_a_119000001232

ゝ一纸荒年。/ 2023年07月07日 05:52/ 0 赞/ 56 阅读

相关 FormData简介

FormData 简单介绍 FormData是Ajax 2.0对象用以将数据编译成键值对，以便于`XMLHttpRequest`来发送数据。[XMLHttpReques

骑猪看日落/ 2022年11月27日 03:17/ 0 赞/ 165 阅读

相关 ajax传formdata类型的数据_前端利用formData格式进行数据上传，前端formData 传值和 json传值的区别？...

contentType 常见的格式 text/plain ：纯文本格式 application/json： JSON数据格式 application/x-www-form

爱被打了一巴掌/ 2022年11月06日 01:52/ 0 赞/ 205 阅读

相关使用FormData

FormData可以利用AJAX技术进行上传文件 / HTML中/ 上传文件<input type = 'file' id = "UploadFile" ac

骑猪看日落/ 2022年07月13日 06:22/ 0 赞/ 208 阅读

相关前端开发调试经验

一、ajax请求注意写上console.log(data)，这里的data是指服务器返回的结果，同时浏览器开启捕获异常模式，这样一旦发生异常或错误，前端就可以不借助后端查看日志

超、凢脫俗/ 2022年06月18日 06:51/ 0 赞/ 200 阅读

相关前端经验_new FormData

FormData 对象的使用： 1.用一些键值对来模拟一系列表单控件：即把form中所有表单元素的name与value组装成一个queryString 2.异步上传二进制文

电玩女神/ 2022年05月21日 04:39/ 0 赞/ 532 阅读

相关前端经验_调试

1.Chrome 浏览器可以调试手机。 2.Element：查看HTML结构（1）可以直接按delete键删除（2）可以右击Edit as html编辑选中的元素

矫情吗；*/ 2022年05月21日 04:38/ 0 赞/ 223 阅读

相关前端经验_上传文件

如果我们上传文件，不用框架自己写，用到`<input tyrpe="file">` 具体的操作呢？ `<input tipe=file >`的默认效果是： ![这里写

￡神魔★判官ぃ/ 2022年05月21日 04:38/ 0 赞/ 206 阅读

相关前端formData对象学习

formdata对象内容遍历 // Create a test FormData object var formData = new FormData(); fo

落日映苍穹つ/ 2022年04月15日 05:41/ 0 赞/ 207 阅读

相关 FormData对象

FormData对象一、什么是FormData对象二、语法三、express处理formdata对象四、FormData对象实例的方法

以你之姓@/ 2021年09月07日 06:12/ 0 赞/ 422 阅读