这里实现的功能是上传图片限制图片的宽高比为2:1
html代码
<input type="file" name="txt_file" id="file" multiple />
js代码
//初始化input
$('#file').fileinput({
language: 'zh', //设置语言
uploadUrl: 'test', //上传的地址
allowedFileExtensions: ['jpg', 'gif', 'png'],//接收的文件后缀
browseClass: "btn btn-primary", //按钮样式
//dropZoneEnabled: false,//是否显示拖拽区域
//minImageWidth: 50, //图片的最小宽度
//minImageHeight: 50,//图片的最小高度
//maxImageWidth: 1000,//图片的最大宽度
//maxImageHeight: 1000,//图片的最大高度
//maxFileSize: 0,//单位为kb,如果为0表示不限制文件大小
//minFileCount: 0,
maxFileCount: 10, //表示允许同时上传的最大文件个数
enctype: 'multipart/form-data',
validateInitialCount:true,
previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}!",
});
//绑定一个文件加载完成的事件
$('#file').on('fileloaded',function(event, file, previewId, index, reader){
var img = new Image();
img.src = reader.result;//reder.result是base64图片格式的数据
img.onload=function(argument){//可以通过img获取图片的信息再自己做逻辑判断
if(this.width!=2*this.height){
alert('图片不符合2:1宽高');
$('.kv-file-remove:last').trigger('click');//不符合的话就触发对应的图片的删除点击事件
}
}
});
有什么问题欢迎留言~