<input type="file" name="file" id = "input_file" accept="image/gif,image/jpeg,image/jpg,image/png,image/svg" >
var formData = new FormData();
//添加图片信息的参数
formData.append('path', $('#input_file')[0].files[0]);
$.ajax({
url: saveUrl + "uploadImg.ajax",
type: 'POST',
//上传文件不需要缓存
cache: false,
data: formData,
// 告诉jQuery不要去处理发送的数据
processData: false,
// 告诉jQuery不要去设置Content-Type请求头
contentType: false,
mimeType: "multipart/form-data",
async:true,
success: function (msg) {
var data = JSON.parse(msg);
if(data.errCode == "0000"){
var saveImageUrl = data.saveImageUrl;
var imageName = data.imageName;
$("#saveImageUrl").val(saveImageUrl);
$("#imageName").val(imageName);
if("" != saveImageUrl){
saveInfo();
}else{
popTips("图片上传失败！");
}
}else{
saveInfo();
popTips(data.errMsg);
}
},error: function (data) {
popTips("上传异常！");
}
})
formData.append(‘path’, $(’#input_file’)[0].files[0]); 这一句很关键 前段代码：
// 这里使用display:none将input标签隐藏 点击按钮实现文件的上传，使用到formData对象，可以理解为HTML中的form表单的抽象； 使用创建一个formData对象，使用ajax进行异步提交数据；
js代码：
点击button按钮触发input标签
function select_file(){ $("#file").trigger(“click”); }
function fileUpload(){ # 创建formdata对象 var formData = new FormData(); # 给formData对象添加标签,注意与input标签的ID一致 formData.append(‘file’, $(’#file’)[0].files[0]); $.ajax({ url : ‘/xxx’,//这里写你的url type : ‘POST’, data : formData, contentType: false,// 当有文件要上传时，此项是必须的，否则后台无法识别文件流的起始位置 processData: false,// 是否序列化data属性，默认true(注意：false时type必须是post) dataType: ‘json’,//这里是返回类型，一般是json,text等 clearForm: true,//提交后是否清空表单数据 success: function(data) { //提交成功后自动执行的处理函数，参数data就是服务器返回的数据。 aler(‘上传成功’); }, error: function(data, status, e) { //提交失败自动执行的处理函数。 console.error(e); } }); }
