Bootstarp-fileinput使用
基本版本:v4.3.3
1、基本引入
fileinput.min.js、fileinput.min.css、zh.min.js(可选,中文汉化)
2、页面组件
<inputid="myFile" name="uploadImgFile" type="file" value="上传" multiple data-show-caption="true" class="myfile" />
3、Javascript 使用
$(document).ready(function() {
$('#myFile').fileinput({
//初始化上传文件框
language: "zh",//配置语言
showUpload : true, //显示整体上传的按钮
showRemove : true,//显示整体删除的按钮
uploadAsync: true,//默认异步上传
uploadLabel: "上传",//设置整体上传按钮的汉字
removeLabel: "移除",//设置整体删除按钮的汉字
uploadClass: "btn btn-primary",//设置上传按钮样式
showCaption: true,//是否显示标题
dropZoneEnabled: false,//是否显示拖拽区域
uploadUrl: 'uploadImgFile.do',//这个是配置上传调取的后台地址,本项目是SSM搭建的
maxFileSize : 9999,//文件大小限制
maxFileCount: 9999,//允许最大上传数,可以多个,
enctype: 'multipart/form-data',
allowedFileExtensions : ["jpg", "png","gif","docx","zip","xlsx","txt","db"],/*上传文件格式限制*/
msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}!",
showBrowse: true,
showPreview:false,
browseOnZoneClick: true,
slugCallback : function(filename) {
return filename.replace('(', '_').replace(']', '_');
},
uploadExtraData:function(){
var data={
id:$("#id").val()
}
return data;
}
})
});