1 ?easyui form提交

$('form').form('submit',{url:'';onSubmit:'';success:function(data){//這種方法獲取到的data是字符串的形式，需要將數(shù)據(jù)進(jìn)行轉(zhuǎn)化方可利用其內(nèi)部的數(shù)據(jù)data=JSON.parse(data);if(data.result){}　} })

提交的數(shù)據(jù)是利用jquery 中的serialize()方法，將表單中的數(shù)據(jù)轉(zhuǎn)化為請求字符串的形式，我們可以使用$('form').serialize();來查看要提交的數(shù)據(jù)；

但是在此過程中一定注意若表單中有類似textarea的控件 ，且在輸入域中輸入了空格，獲取到的參數(shù)信息會轉(zhuǎn)化為‘+’號（par1=other&par2=-1&par3=sss+fffff++ffff）

是因為URL規(guī)范里就是要求空格在query string里被編碼為加號吧。

詳見（https://en.wikipedia.org/wiki/Query_string#URL_encoding）

注：類似于$().serialize() 方法還有 $().serializeArray 和$().param(arr)方法，可以查看jquery手冊學(xué)習(xí)

??　　$("#results").append( "<tt>" + $("form").serialize() + "</tt>" );

2 ?formData提交

新建FormData對象時有兩種方將數(shù)據(jù)加載到實例對象中，其中之一是利用FormData對象的append方法，其二是將form表單元素作為參數(shù)傳遞到FormData構(gòu)造函數(shù)內(nèi)；如下：

(1) var fd = new FormData(); fd.append("username", "Groucho");// fileInputElement中已經(jīng)包含了用戶所選擇的文件fd.append("userfile", fileInputElement.files[0]);(2) var formData = new FormData(form); //內(nèi)部form值需要時js原生對象

?

針對formdata需要注意兩點： 1 想要查看FormData對象內(nèi)部的值時 需要使用方法entries()（對于ie8及以下存在兼容性問題 解決方法詳見https://segmentfault.com/q/1010000007439070?_ea=1345861） ； 2 form表單元素想要傳遞文件需要加入Multipart/form-data var i = formData.entries();i.next(); i.next(); //或者下面是等效的for(var item of formData.entries()){console.log(item[0]+','+item[1]);}

利用formdata進(jìn)行圖片文件上傳時 ，當(dāng)圖片文件 為空時 ，會傳入一個文件流，后臺可能沒有辦法判斷該數(shù)據(jù)是否為空，這就需要前端驗證空參數(shù)時不傳對應(yīng)值

可以利用formdata一項一項添加來修改上面的小bug var fd = new FormData();var postTitleVal = $('#titleId').val();var imgfileVal = $('#imgfile')[0].files;var postContentVal = $('#body_text').val();fd.append("postTitle",postTitleVal);
//注意下面的添加圖片，當(dāng)為多個時，一定要一個一個進(jìn)行添加，否則不會正確的傳值，如下面的圖片所示for(var i = 0;i < imgfileVal.length;i++){fd.append("imgfile",imgfileVal[i]);}fd.append("postContent",postContentVal);return fd;

當(dāng)多圖片時不進(jìn)行一個一個添加時會顯示下面的結(jié)果，傳給后臺的是一個不能識別的object

------WebKitFormBoundarye3BrkT7fRq8QF9FFContent-Disposition: form-data; name="imgfile"[object FileList]當(dāng)直接用var fd = new Formdate（）時，有圖片有選擇時如下可以正常的進(jìn)行傳輸------WebKitFormBoundaryv1LffBUkzjtPjHxQ Content-Disposition: form-data; name="imgfile"; filename="Koala.jpg" Content-Type: image/jpeg ------WebKitFormBoundaryv1LffBUkzjtPjHxQ Content-Disposition: form-data; name="imgfile"; filename="Lighthouse.jpg" Content-Type: image/jpeg當(dāng)不選圖片時（即空參數(shù)），會傳入一個 文件流，后臺可能沒有辦法判斷該數(shù)據(jù)是否為空，可能會造成頁面圖片顯示空白的bug ------WebKitFormBoundaryABIeO4Mf7StP4CdB Content-Disposition: form-data; name="imgfile"; filename="" Content-Type: application/octet-stream

詳見： https://developer.mozilla.org/zh-CN/docs/Web/API/FormData/Using_FormData_Objects https://segmentfault.com/a/1190000006716454#articleHeader11 詳見 ?http://blog.csdn.net/xiaojianpitt/article/details/6856536 form表單元素想要傳遞文件一定注意需要加入Multipart/form-data

?總結(jié)：上傳數(shù)據(jù)格式常用的有:

? ? ? ? 1 請求字符串 name=value&age=3的形式；

　　 2 json對象形式；

　　 3 formData對象格式；

當(dāng)然也可以有其他類型，詳見http://www.cnblogs.com/haitao-fan/p/3908973.html

https://developer.mozilla.org/en-US/docs/Web/API/FormData/entries

轉(zhuǎn)載于:https://www.cnblogs.com/xhliang/p/7732261.html

總結(jié)

以上是生活随笔為你收集整理的easyui form提交和formdata提交记录，查看FormData对象内部的值的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。