FormData对象
FF4中增加了一个很有意思的对象,FormData。通常我们提交(使用submit button)时,会把form中的所有表格元素的name与value组成一个queryString,提交到后台。这用jQuery的方法来说,就是serialize。但当我们使用Ajax提交时,这过程就要变成人工的了。因此,FormData对象的出现可以减少我们一些工作量。
想得到一个FormData对象,很简单:
var formdata = new FormData();
但一个空的FormData对象对我们没有意义,因此W3c草案提供了三种方案来获取或修改FormData。
方案1:创建一个空的FormData对象,然后再用append方法逐个添加键值对:
var formdata = new FormData();
formdata.append("name", "司徒正美");
formdata.append("blog", "http://www.cnblogs.com/rubylouvre/");
方案2:取得form元素对象,将它作为参数传入FormData对象中!
var formobj = document.getElementById("form");
var formdata = new FormData(formobj);
方案3:利用form元素对象的getFormData方法生成它!
var formobj = document.getElementById("form");
var formdata = formobj.getFormData()
注意,formdata是一个不透明的对象,现在暂时只有一个append可以操作,不能通过序列化手段得到其里面的内容,这实在是遗憾。它的用法现在也只有一个,用于增强型的XMLHttpRequest对象的send方法中去!
var formElement = document.getElementById("myFormElement");
formData = formElement.getFormData();
formData.append("serialnumber", serialNumber++);
xhr.send(formData);
FormData对象的更多相关文章
- 通过Ajax使用FormData对象无刷新上传文件
写在前面:本文说的这个方案有浏览器兼容性问题:所有主流浏览器的较新版本已经支持这个对象了,比如Chrome 7+.Firefox 4+.IE 10+.Opera 12+.Safari 5+,对兼容性比 ...
- H5 FormData对象的使用
XMLHttpRequest Level2 添加了一个新的接口--FormData .[ 主要用于发送表单数据,但也可以独立使用于传输键控数据.与普通的Ajax相比,它能异步上传二进制文件 ] 利用F ...
- html5的FormData对象和input的file属性以及window.URL.createObjectURL( ) 方法(转载)
/** FormData ==>表单数据 能自动把表单数据拼接打包 当ajax发送数据时,发送打包的数据; 还可以使用FormData对象的append(key,value)添加数据 FormD ...
- HTML的FormData对象
FormData是HTML5标准制定的一个新的封装对象,有了FormData对象,可以方便地通过javascript创建表单数据,直接以ajax发送到服务器中. 目前浏览器的支持情况为: 详细的介绍与 ...
- 通过jQuery Ajax使用FormData对象上传文件
FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单". 在 Mozilla Developer 网站 使用For ...
- Ajax发送FormData对象封装的表单数据
前端页面: <!doctype html> <html lang="en"> <head> <meta charset="UTF ...
- 使用JS的FormData对象
利用FormData对象,你可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单". 创建一个FormData对象 你可以先创建一个空的F ...
- FormData+Ajax 实现多文件上传 学习使用FormData对象
FormData对象是为序列化表以及创建与表单格式相同的数据(当然是用于XHR传输)提供便利. 今天我们使用dropzone和FormData实现多文件上传功能. var SAMP = null; / ...
- 使用HTML5 FormData对象实现大文件分块上传(断点上传)功能
FormData是HTML5新增的一个对象,通过FormData对象可以组装一组用 XMLHttpRequest发送请求的键/值对.它可以更灵活方便的发送表单数据,因为可以独立于表单使用.如果你把表单 ...
随机推荐
- 给你完美浪漫的七夕,APICloud送你双人电影票!
我一直觉得“幸福的感觉” 就像存款 留着以后用 会幸福感爆棚 于是,我一直习惯于等等,再等等 以为那样就会很幸福 直到有一天,突然发现,在我构想的未来中,总是有你 世界那么大,我只在乎你 世界那么长, ...
- PHP回调函数的几种用法
PHP回调函数的实现方法 目录 前言 全局函数的回调 类静态函数的回调 对象的方法的回调 PHP事件模型(观察者模式)的实现思路 前言 最近在开发一个PH ...
- SQL Server中的SQL语句优化与效率问题
很多人不知道SQL语句在SQL SERVER中是如何执行的,他们担心自己所写的SQL语句会被SQL SERVER误解.比如: select * from table1 where name='zhan ...
- C语言下WebService的使用方式
用gSoap工具: 1.在dos环境中到gSoap工具对应的目录gsoap_2.8.18\gsoap-2.8\gsoap\bin\win32路径下,执行wsdl2h -c -o *.h ht ...
- Java控制语句——if语句
Java控制语句分为三大类:①顺序结构:②选择结构:③循环结构. 选择结构又分为:①单选择结构:②双选择结构:③多选择结构. 主要涉及: if_else , switch , while , brea ...
- linux input输入子系统应用分析
输入设备(如按键.键盘.触摸屏.鼠标等)是典型的字符设备,其一般的工作机理是底层在按键.触摸等动作发送时产生一个中断(或驱动通过timer定时查询),然后CPU通过SPI.I2 C或外部存储器总线读取 ...
- IDisplayTransformation
IDisplayTransformation Bounds Full extent in world coordinates. The Bounds property controls the ful ...
- 连接sql server数据库的两种方式
class DB { private static SqlConnection conn; public static SqlConnection getConn() { //conn = n ...
- TIJ——Chapter One:Introduction to Objects
///:~容我对这个系列美其名曰"读书笔记",其实shi在练习英文哈:-) Introduction to Objects Object-oriented programming( ...
- Lintcode: Sort Colors II
Given an array of n objects with k different colors (numbered from 1 to k), sort them so that object ...