1.JSP页面部分 引入 jQuery v1.8.3.js和bootstrap.css
//配置项
<script type="text/javascript">
var config = {
support: "image/jpg,image/png,image/bmp,image/jpeg,image/gif", // Valid file formats
form: "demoFiler", // Form ID
dragArea: "dragAndDropFiles", // Upload Area ID
uploadUrl: "${ctx}/upload/fileUpload", // Server side upload url
submitHandler:"submitHandler" //上传按钮
}
</script>
//JSP页面
<form name="demoFiler" id="demoFiler" enctype="multipart/form-data">
<input type="file" name="multiUpload" id="multiUpload" multiple/>
<input type="button" name="submitHandler" id="submitHandler" value="Upload" class="buttonUpload"/>
</form>
<div class="progress progress-striped active">
<div style="width: 0.1%;" class="bar"></div>
</div>
2.JS
var path=getContextPath();
var delFileList=[];
$(document).ready(function () {
initMultiUploader(config);
});
function multiUploader(config) {
this.config = config;
this.items = "";
this.all = [] ;
this.allFileLists = [];
var self = this;
multiUploader.prototype._init = function () {
if (window.File &&
window.FileReader &&
window.FileList &&
window.Blob) {
var inputId = $("#" + this.config.form).find("input[type='file']").eq(0).attr("id");
document.getElementById(inputId).addEventListener("c