/文件上传控件/
.bar {
background-image: -webkit-linear-gradient(top,#5cb85c 0,#449d44 100%);
background-image: -o-linear-gradient(top,#449d44 100%);
background-image: -webkit-gradient(linear,left top,left bottom,from(#5cb85c),to(#449d44));
background-image: linear-gradient(to bottom,#449d44 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c',endColorstr='#ff449d44',GradientType=0);
background-repeat: repeat-x;
height: 20px;
font-size: 12px;
line-height: 20px;
color: #fff;
text-align: center;
background-color: #428bca;
-webkit-Box-shadow: inset 0 -1px 0 rgba(0,.15);
Box-shadow: inset 0 -1px 0 rgba(0,.15);
-webkit-transition: width .6s ease;
-o-transition: width .6s ease;
transition: width .6s ease;
}

progress {

background-image: -webkit-linear-gradient(top,#ebebeb 0,#f5f5f5 100%);
background-image: -o-linear-gradient(top,#f5f5f5 100%);
background-image: -webkit-gradient(linear,from(#ebebeb),to(#f5f5f5));
background-image: linear-gradient(to bottom,#f5f5f5 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb',endColorstr='#fff5f5f5',GradientType=0);
background-repeat: repeat-x;
height: 20px;
width: 0%;
margin-bottom: 20px;
overflow: hidden;
background-color: #f5f5f5;
border-radius: 4px;
-webkit-Box-shadow: inset 0 1px 2px rgba(0,.1);
Box-shadow: inset 0 1px 2px rgba(0,.1);
margin-top: 20px;
}
.glyphicon {
position: relative;
top: 1px;
display: inline-block;
font-family: 'Glyphicons Halflings';
font-style: normal;
font-weight: 400;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.glyphicon-plus:before {
content: "\2b";
}
.btn-success {
color: #fff;
background-color: #5cb85c;
border-color: #4cae4c;
}
.btn {
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 14px;
font-weight: 400;
line-height: 1.42857143;
text-align: center;
white-space: nowrap;
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-radius: 4px;
}

$('#file_upload').fileupload({ dataType: 'json',url:'${pageContext.request.contextPath}/excel/upload',autoUpload:false,add: function (e,data) { $('#progress').css( 'width','0%' ); $('#progress .bar').css( 'width','0%' ); $("#uploadText").empty(); var fileType = data.files[0].name.split('.').pop(); // console.log(data); var acceptFileTypes = /xls|xlsx$/i; var size = data.files[0].size; size = (size/1024).toFixed(2);//文件大小单位kb var maxFileSize = 5*1024;//最大允许文件大小单位kb if (!acceptFileTypes.test(fileType)) { new Message({message:"不支持的文件类型，仅支持EXCEL文件"}); return ; } if(size>maxFileSize){ new Message({message:"文件大小："+size+"KB,超过最大限制："+maxFileSize+"KB"}); return ; } data.context = $("").text("上传") .appendTo("#uploadText") .click(function () { data.context = $("

").text("正在上传...").replaceAll($(this)); data.submit(); }); },progressall: function (e,data) { var progress = parseInt(data.loaded / data.total * 100,10); $('#progress').css( 'width','100%' ); $('#progress .bar').css( 'width',progress + '%' ); },fail:function (e,data) { new Message({message:"上传失败"}); },done: function (e,data) { console.log(data.files[0]); var fileName = data.files[0].name; var size = data.files[0].size; var obj = data.result; if(obj.success == true){ $("#filePath").val(obj.result.fileId+"&"+obj.result.opLogId); data.context.text("文件上传已完成！文件名："+fileName+" 文件大小："+size+"kb"); }else{ alert(obj.errorMsg); } } });