js規定圖片上傳的尺寸與大小
阿新 • • 發佈:2020-08-04
<div class="file-box layui-col-md6"> <input type="file" lay-verify="ad_img" value="" name="ad_img[]" id="input_file" class="input_file" accept="image/gif,image/jpeg,image/jpg,image/png,image/svg" onchange="uploadAndShow1(this)"> <img src="" alt="" style="width: 100%;height: 100%" /> </div>
js:
//圖片上傳 function uploadAndShow1(obj) { var fileSize = 0; var fileMaxSize = 1024; //1M var filePath = obj.value; var reader = new FileReader(); if (filePath) { fileSize = obj.files[0].size; var size = fileSize / 1024; if (size > fileMaxSize) { layer.msg("圖片大小不能超過1M", { time: 2000, icon: 10 }); obj.value = ""; return false; }else{ var reader = new FileReader(); reader.onload = function(e) { var image = new Image(); image.src = e.target.result; image.onload = function() { var height = this.height; var width = this.width; if(width!=800 && height!=800 ){ layer.msg("請上傳800*800畫素的圖片", { time: 2000, icon: 10 }); obj.value = ""; return false; }else{ $(obj).parent().find('img').attr('src', e.target.result); $(obj).css({ "position":"absolute", "opacity":"0", }); } }; }; reader.readAsDataURL(obj.files[0]); } } else { return false; } }