FormData对象

FormData是H5新增的一个HTML对象，可以用JS代码来传输 Content-type:multipart/form-data 的对象

初始化

通常有两种初始化方式

1 2 3 4

//新建一个空的Form对象 var form1 = new FormData(); //通过读取一个已经存在的Form标签来新建对象 var form2 = new FormData(document.getElementById("formId"));

添加变量

可以使用append/get方法来进行字段的添加和删除

1 2 3 4

//添加某个名为key的字段 form1.append("key","value"); //取出文件添加入file字段 form1.append("file",$('#file').files[0]);

注意files函数返回的是一个文件数组，注意取出对象

获得变量值

FormData对象内的参数是私有的，无法通过打点调用，需要通过get函数来读取，但是貌似Safari不支持，Chrome支持

1 2 3 4

//错误的方式 var key1 = form1.key //正确的方式 var key2 = form1.get("key")

发送Ajax

在发送Ajax的时候，由于FormData本身已经设定了Content-type所以JQuery的Ajax需要设定一些参数

1 2 3 4 5 6 7 8

$.ajax("url", { type: 'POST', data: form1, processData: false, //不对数据进行处理 contentType: false //不对Content-type进行处理 } ).done(function(res) { }).fail(function(res) {});

后台的处理

出了要发送订制过的Ajax之外，也需要在后台开启multipart/form-data的数据绑定和接收，以Java为例，参考 HTTP的参数绑定

缺失模块。
1、请确保node版本大于6.2
2、在博客根目录（注意不是yilia根目录）执行以下命令：
npm i hexo-generator-json-content --save

3、在根目录_config.yml里添加配置： jsonContent: meta: false pages: false posts: title: true date: true path: true text: false raw: false content: false slug: false updated: false comments: false link: false permalink: false excerpt: false categories: false tags: true