这篇文章主要介绍了

php+html5

使用

FormData

对象提交表单及上传图片的方法

,

实例分

析了

FormData

对象的使用技巧

,

非常具有实用价值

,

需要的朋友可以参考下

代码如下

: 

代码如下

: 

本文实例讲述了

php+html5

使用

FormData

对象提交表单及上传图片的方法。分享给大

家供大家参考。具体分析如下：

FormData 

对象，可以把

form

中所有表单元素的

name

与

value

组成一个

queryString

，

提交到后台。在使用

Ajax

提交时，使用

FormData

对象可以减少拼接

queryString

的工作量。

使用

FormData

对象

1.

创建一个

FormData

空对象，然后使用

append

方法添加

key/value 

代码如下

: 

var formdata = new FormData(); 

formdata.append('name','fdipzone'); 

formdata.append('gender','male'); 

代码如下

: 

2.

取得

form

对象，作为参数传入到

FormData

对象

代码如下

: 

;form name="form1" id="form1"; 

;input type="text" name="name" value="fdipzone"; 

;input type="text" name="gender" value="male"; 

;/form; 

代码如下

: 

var form = document.getElementById('form1'); 

var formdata = new FormData(form); 

代码如下

: 

使用

FormData

提交表单及上传文件：

代码如下

: 

代码如下

: 

;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"; 

;html; 

;head; 

;meta http-equiv="content-type" content="text/html; charset=utf-8"; 

;title; FormData Demo ;/title; 

;script src="/js/jquery-1.11.0.min.js";;/script; 

;script type="text/javascript"; 

;!-- 

function fsubmit(){ 

var data = new FormData($('#form1')[0]); 

$.ajax({ 

url: 'server.php', 

type: 'POST', 

data: data,