<inputtype="file"accept="imageUploadPic.prototype._addEvent= function() {var_this= this;functiontmpSelectFile(ev) {
_this._handelSelectFile(ev);
}this.input.addEventListener('change', tmpSelectFile,false);
};UploadPic.prototype._handelSelectFile= function(ev) {varfile=ev.target.files[0];this.type=file.type//如果没有文件类型,则通过后缀名判断(解决微信及360浏览器无法获取图片类型问题)
if(!this.type) {this.type= this.mime[file.name.match(/\.([^\.]+)$/i)[1]];
}if(!/image.(png|jpg|jpeg|bmp)/.test(this.type)) {
alert('选择的文件类型不是图片');return;
}if(file.size> this.maxSize) {
alert('选择文件大于' + this.maxSize/ 1024 / 1024 + 'M,请重新选择');return;
}this.fileName=file.name;this.fileSize=file.size;this.fileType= this.type;this.fileDate=file.lastModifiedDate;this._readImage(file);
};UploadPic.prototype._readImage= function(file) {var_this= this;functiontmpCreateImage(uri) {
_this._createImage(uri);
}this.loading();this._getURI(file, tmpCreateImage);
};UploadPic.prototype._getURI= function(file, callback) {varreader= newFileReader();var_this= this;functiontmpLoad() {//头不带图片格式,需填写格式
varre= /^data:base64,/;varret= this.result+ '';if(re.test(ret)) ret=ret.replace(re,'data:' +_this.mime[_this.fileType]+ ';base64,');
callback&&callback(ret);
}
reader.οnlοad=tmpLoad;
reader.readAsDataURL(file);return false;
};UploadPic.prototype._createImage= function(uri) {varimg= newImage();var_this= this;functiontmpLoad() {
_this._drawImage(this);
}
img.οnlοad=tmpLoad;
img.src=uri;
};UploadPic.prototype._drawImage= function(img, callback) {this.sw=img.width;this.sh=img.height;this.tw=img.width;this.th=img.height;this.scale=(this.tw/ this.th).toFixed(2);if(this.sw> this.maxWidth) {this.sw= this.maxWidth;this.sh=Math.round(this.sw/ this.scale);
}if(this.sh> this.maxHeight) {this.sh= this.maxHeight;this.sw=Math.round(this.sh* this.scale);
}this.canvas=document_createElement_x_x('canvas');varctx= this.canvas.getContext('2d');this.canvas.width= this.sw;this.canvas.height= this.sh;
ctx.drawImage(img,0,0, img.width, img.height,0,0,this.sw,this.sh);this.callback(this.canvas.toDataURL(this.type));
ctx.clearRect(0,0,this.tw,this.th);this.canvas.width= 0;this.canvas.height= 0;this.canvas= null;
};script>
body>
html>