XMLHttpRequest FormData

What is FormData

MDN

XMLHttpRequest Level 2 adds support for the new FormData interface. FormData objects provide a way to easily construct a set of key/value pairs representing form fields and their values,which can then be easily sent using the XMLHttpRequest send() method.

XMLHttpRequest 第二版添加了对新接口 FormData支持FormData 可以很方便地将表单字段和它们的值建立成键和值对应的成对形式,然后通过 XMLHttpRequestsent() 方法发送表格数据。

Constructor

FormData()

用于新建一个 FormData 对象:

javascriptvar formData = new FormData(form);

也可以先创建一个FormData 对象,之后再添加对应的键和值,append() 方法请看下面。

javascriptvar formData = new FormData();
formData.append('username','Justin');

Method

FormData.append

方法用于向已存在的键添加新的值,如该键不存在,新建之。

语法

javascriptformData.append(name,value);
formData.append(name,value,filename);

参数解释

  • name
    键 (key), 对应表单域
  • value
    表单域的值
  • filename (optional)
    The filename reported to the server (a USVString),when a Blob or File is passed as the second parameter. The default filename for Blob objects is "blob".

FormData.delete

将一对键和值从 FormData 对象中删除

javascriptformData.delete(username);

FormData.get

返回给定键的第一个

javascriptformData.append('username','Justin');
formData.append('username','Chris');
formData.get(username);    // "Justin"

FormData.getAll

返回给定键的所有值

javascriptformData.append('username','Chris');
formData.get(username);    // ["Justin","Chris"]

FormData.has

检查是否包含给定键,返回 truefalse

javascriptformData.has(username);

FormData.set

设置给定键的值

javascriptformData.set(name,value);
formData.set(name,filename);

浏览器兼容情况

来自 MDN

Desktop

Feature Chrome Firfox(Gecko) Intenet Explorer Opera Safari
Basic support 7+ 4.0(2.0) 10+ 12+ 5+
append with filename (Yes) 22.0(22.0) ? ? ?
delete,get,getAll,has,set Behind Flag Not supported Not supported (Yes) Not supported

Mobile

Feature Android Chrome Android Firfox Mobile (Gecko) Firfox OS (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 3.0 ? 4.0(2.0) 1.0.1 ? 12+ ?
append with filename ? ? 22.0(22.0) 1.2 ? ? ?
delete,set (Yes) (Yes) Not supported Not supported Not supported (Yes) Not supported

相关文章

IE6是一个非常老旧的网页浏览器,虽然现在很少人再使用它,但...
PHP中的count()函数是用来计算数组或容器中元素的个数。这个...
使用 AJAX(Asynchronous JavaScript and XML)技术可以在不...
Ajax(Asynchronous JavaScript and XML)是一种用于改进网页...
本文将介绍如何通过AJAX下载Excel文件流。通过AJAX,我们可以...
Ajax是一种用于客户端和服务器之间的异步通信技术。通过Ajax...