input-file 图片上传尺寸验证

来源:互联网 发布:win10网络重置命令 编辑:程序博客网 时间:2024/06/13 23:50

uploadimg.html

<!DOCTYPE html><html lang="utf-8"><head><meta charset="UTF-8"><title>Document</title><script type="text/javascript" src="test2.js"></script></head><body><form action="upload.do"><input type="file" name="logo"  id="logo" onChange="handleConLogo(this.files);" accept="image/*"> <br><input type="file" name="id_photo"  id="id_photo" onChange="handleConId_photo(this.files);" accept="image/*"> <br><input type="submit" value="提交"><a href="http://www.gaitubao.com/" target="_black">图片尺寸修改</a></form></body></html>

uploadimg.js

var width,height;function handleConLogo(files){   for (var i = 0; i < files.length; i++) {    var file = files[i];    var reader = new FileReader();    var ret = [];    reader.onload = function(theFile) {        var image = new Image();        image.onload = function() {            width=this.width;             height=this.height;            if(width> 200 || height> 200){                fill = false;                alert("图片像素不符合,应小于200px*200px,建议重新上传!");            }else{                alert("图片格式符合要求!")            }        };        image.src = theFile.target.result;    }    reader.readAsDataURL(file);}}function handleConId_photo(files){   for (var i = 0; i < files.length; i++) {    var file = files[i];    var reader = new FileReader();    var ret = [];    reader.onload = function(theFile) {        var image = new Image();        image.onload = function() {            width=this.width;             height=this.height;            if(width> 200 || height> 400){                fill = false;                alert("图片像素不符合,应小于200px*400px,建议重新上传!");            }else{                alert("图片格式符合要求!")            }        };        image.src = theFile.target.result;    }    reader.readAsDataURL(file);}}