//文件名称采用的是js原生获取方式
var file = document.getElementById("cover_img").files[0];
//利用FormData传送文件 append添加需要的数据 var fileObj = new FormData(); fileObj.append('imageFile', file); fileObj.append('fileName', file.name);
//利用XMLHttpRequest对象向后台发送文件 var xhr = new XMLHttpRequest();
//请求方式,路径, xhr.open('post','url',true);
//返回值 xhr.onload = function () { if(xhr.readyState == 4 && xhr.status == 200){ var resultData = xhr.responseText; if(resultData == ''){ layer.close(updateIndex) layer.alert("保存成功") }else{ var result = $.parseJSON(resultData); layer.alert(result.msg); }
} else { alert("请联系管理员"); return; }; };
//发送请求 xhr.send(fileObj);
注:
文件上传方式有多种;
但是ajax利用FormData对象传输文件,后台接收不到文件,具体原因不明,有待继续验证
下面补上ajax上传方式,经测试可以上传
var TESTFILE = document.getElementById("TESTFILE").files[0]; var formData = new FormData(); formData.append("file", TESTFILE); formData.append("fileName", TESTFILE.name); $.ajax({ url:"${pageContext.request.contextPath}/videomanager/TESTFILE.json", type:"post", // 必须为post,基础,不解释 data:formData, dataType:"json",
//cache: false, 关闭缓存,一定不要加,否则会接收不到参数,ajax传递数据靠的就是缓存,关闭之后如何才能传递参数?只要返回值吗?在这里吐槽下说让加的,是何居心? processData:false, //必须参数 序列化参数 contentType:false, //必须参数 内容类型,不错的一个属性,可以查查资料了解了解,具体作用就是可以将复杂的参数传递到后台 success:function(result){ console.log(result); }, error:function(){ alert("error"); } });