使用了input file文件上传控件,当上传成功之后,想着清空刚才的文件名,发现使用jquery的val("")还有其他方式都没作用,然后搜索看到是因为浏览器的安全机制阻止了修改,参考其他的方法进行修改,参考网址:
/lihefei_coder/article/details/76850498
1.我的网页代码:
<h2 style="margin:15px;color: #3CB671;font-weight: bolder;">上传体检档案区域</h2><div id="import" style="top: 50%;left: 40%; background: #F7F4F4;"><forms method="post" class="form-inline" id="forminfor_physical"><p class="upfiles">*提示:请按照 <em style="color: red;font-weight: bold;">0813_0102_XXX.doc</em> 格式上传,否则无法解析</p><p class="files"><input type="file" value="" name="uploadFile" id="fileChange_physical" /></p><p class="file-btn"><input type="button" ng-click="fileReset_physical($event)" value="取消" /><input type="submit" ng-click="upFileBtn_physical()" value="确认" /></p></form></div>
2.js的代码:
//上传文件$scope.upFileBtn_physical=function(){if($('#fileChange_physical').val()=='' || $('#fileChange_physical').val()==null){$.showDialog({inner:'不能为空'});return;};var formElement = document.getElementById("forminfor_physical");var data = new FormData(formElement);//为FormData对象添加数据$.each($('#fileChange_physical')[0].files, function(i, file) {data.append('uploadFile', file);});$.ajax({url:'retireInfor/uploadPhysicalFile',type:'POST',data:data,async:false,cache:false,dataType:"json",contentType:false,processData:false,}).done(function(json){$.showDialog({inner:json.message})//$("#fileChange_physical").attr("value", "未选择任何文件");//上传成功,清空文件输入框,8月14日17:54:00var file = document.getElementById('fileChange_physical');file.value = ''; //虽然file的value不能设为有字符的值,但是可以设置为空值//或者file.outerHTML = file.outerHTML; //重新初始化了file的html}).fail(function(){$.showDialog({inner:json.message});});};//清空输入框$scope.fileReset_physical=function(ev){var file = document.getElementById('fileChange_physical');file.value = ''; //虽然file的value不能设为有字符的值,但是可以设置为空值//或者file.outerHTML = file.outerHTML; //重新初始化了file的html}
主要是这句代码,重新重置文件名输入框的html:
//清空输入框
$scope.fileReset_physical=function(ev){
var file = document.getElementById('fileChange_physical');
file.value = ''; //虽然file的value不能设为有字符的值,但是可以设置为空值
//或者
file.outerHTML = file.outerHTML; //重新初始化了file的html
}
如果觉得《html input file 清空上传的文件输入框 angular版本》对你有帮助,请点赞、收藏,并留下你的观点哦!