系统学习前端之FormData详解

weixin_34228387

于 2016-08-25 12:21:11 发布

阅读量1.8k

点赞数 1

文章标签：前端 javascript ViewUI

原文链接：https://segmentfault.com/a/1190000006716454

版权

本文详细介绍了前端中FormData的用途、构造函数、操作方法，包括添加、修改、删除数据，以及如何通过XMLHttpRequest发送数据，是理解并利用FormData进行文件上传等操作的重要参考资料。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

FormData

1. 概述

FormData类型其实是在XMLHttpRequest 2级定义的，它是为序列化表以及创建与表单格式相同的数据（当然是用于XHR传输）提供便利。

2. 构造函数

创建一个formData对象实例有几种方式

1、创建一个空对象实例

var formData = new FormData();

此时可以调用append()方法来添加数据

2、使用已有的表单来初始化一个对象实例

假如现在页面已经有一个表单

<form id="myForm" action="" method="post">
    <input type="text" name="name">名字
    <input type="password" name="psw">密码
    <input type="submit" value="提交">
</form>

我们可以使用这个表单元素作为初始化参数，来实例化一个formData对象

// 获取页面已有的一个form表单
var form = document.getElementById("myForm");
// 用表单来初始化
var formData = new FormData(form);
// 我们可以根据name

最低0.47元/天解锁文章