一 页面结构
<input type="file" name="image" value=" " accept="image/*" multiple />
name : 设置保存图片的属性名
value : 保存的图片
multiple: 设置这个属性可以选择多个图片
二 js代码
1 上传服务器代码
var formData = new FormData($('#sumbit-up')[0]); //序列化表单 // var data =$('#sumbit-up').serialize(); //序列化数据,但不能序列化文件 $.ajax({ type: 'post', url: __domain__ + 'api/merge/singeapi/type/userComment', // data:data, data: formData, processData: false, contentType: false, success: function(data) { alert(JSON.stringify(data)); }, error: function(XMLHttpRequest, textStatus, errorThrown) { alert("上传失败,请检查网络后重试"); } });
2 详细介绍
FormData和serialize 都是序列化表单,区别在与:后者只能序列化表单数据,比如select,比如文本框等input select等的数据,
但是对于文件,比如文件上传,无法实现,那么这时候,FormData就上场了。
processData和contentType 缺少这二者的设置,将会出现 红色部分的错误提示,提交失败。