FormData中文件上传、预览、富文本编辑器取值

如上图所示：我们需要做发表文章功能,如果表单中有红色框出来的文件上传，那么必须使用FormData收集表单数据。
注意：使用FormData，html结构中必须要有name属性，属性值必须和后端提供的字段名保持一致。（因为是通过name属性收集数据的）。

小点：如果是select标签，必须给select标签设置name属性，select里面option标签设置value属性以及值（value=‘1’）-1代表新闻。

1、jquery中ajax传FormData参数

必须设置下面2行代码，否则报错

2、头像预览功能

功能描述：点击选择文件后，预览图片。
change是jquery中的事件，需要加载jq.js文件

步骤：
1、设置点击事件change
2、获取文件对象
3、创建临时url
4、设置img的src属性为临时url

 $("#btn").change(function(){
 //2、获取文件对象
 var obj = this.files[0];

 //3、创建临时url
 var url=URL.createObjectURL(obj);

 //4、设置src属性
 $('#img').attr('src',url);

})

3、请求参数

一般请求参数都是后端提供给我们的，所以说我们传参的话必须要和后端的字段名保持一致（无论是数量还是名字），少一个或者名字不对都会导致无法传参。

下图中是对formddata中收集的表单数据进行传参，由于html页面中没有和后端提供的state参数相关的结构，所以需要手动给formdata中通过append()方法添加state参数，这样才不会报错。

第一张图，最后一行【文章内容】右侧的富文本编辑器，formdata无法获取到里面的内容，所以需要通过formdata的set()方法重新给content设置一个值（这个值代表：获取富文本里面的内容）