更换上传图片不符合条件时,展示原来的图片
2019-04-09 本文已影响0人
山丘lemon
//在上传图片的时候,不符合指定宽高的时候return false, 并且显示原来的图片
<input class="cm-fail-input" type="file" name="上传" title="上传" ng-model="logoImg" onchange="angular.element(this).scope().changeLogImg(this)">
$scope.changeLogImg = function (tag) {
var file = $(tag)[0].files[0];
if (!(file.type == "image/png" || file.type == "image/jpeg")) {
angular.element('.cm-fail-input').val(null);
"图片格式不正确,请选择PNG或JPG格式"
return false;
}
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function () {
var image = new Image();
if (file.size > 800 * 1024) {
angular.element('.cm-fail-input').val(null);
message: "图片大小不能超过800KB,请重新选择"
return false
}
image.onload = function () {
var width = image.width;
var height = image.height;
if (width != 1920 || height != 112) {
message: "标题图片分辨率要求为1920*112,请重新选择"
$scope.iconImgSizeChecked = false;
return false
} else {
$scope.iconImgSizeChecked = true;
}
var base64 = this.result;
image.src = base64;
$scope.$apply(function () {
$timeout(function () {
//在这里判断,是否符合条件,符合就走else,不符合的话就把返回的图片(原来的图片)展示,并且置为true,再次选择的时候会重新走上面的判断
if (!$scope.iconImgSizeChecked) {
$scope.messageObj[name + 'Img'] = $scope.iconImg;
$scope.iconImgSizeChecked = true;
} else {
$scope.messageObj[name + 'Img'] = base64;
}
}, 600)
});
}