bootstarp 前端js文件上传

<-- 上传文件的表单 -->
<form id="uploadform" action="/order/create" method="post" enctype="multipart/form-data" style="display: none">
	<input type="file" name="file" id="selectFile" multiple onchange="fileupload()"/>
</form>
<--  上传文件按钮  --> 
<button type="button" id="uploadButton" class="btn btn-warning handleButton"  onclick="selectFile()">上传附件</button>
var files= new Array();//储存对个文件的集合 
	//1.点击上传附件按钮 触发 
	function selectFile(){
		$("#selectFile").click();
	}
	//2.选择上传文件 
	function fileupload(){
		var form = document.getElementById("uploadform");
		// 用表单来初始化
		var formData = new FormData(form);
		uploadFile(formData,"/order/uploadFile",uploadCallback);
	}
	//3.文件上传后的结果处理 
	function uploadCallback(result){
		 var fileName = result.data[0];
		 var fielPath = result.data[1];
		 var file={"name":fileName,"downloadPath":fielPath};
		 files.push(file);
		 $("#File_table").bootstrapTable('refresh');
		 $("#item_File_table").bootstrapTable('refresh');
	}
	//4.文件上传后的的展示 
	function ajaxGetFileRequest(params) {
		  if(files != null){
			  params.success({
			        total: files.length,
			        rows: files
			    });  
		  }
		}
	function fileFormatter(value, row, index) {
		return [
		        '<button οnclick="delArrayByindex(\'' + index + '\')" class="btn btn-info btn-sm rightSize detailBtn" type="button">删除</button>&nbsp;&nbsp;',
		        ].join('');
	}
	//删除数组中的文件信息 
	function delArrayByindex(index){
		console.log(index);
		files.pop(index);
		$("#File_table").bootstrapTable('refresh');
	}

猜你喜欢

转载自blog.csdn.net/qq_42806727/article/details/90066215