上传图片js判断图片尺寸和格式兼容IE

前端技术 2023/09/09 JavaScript

js代码:

$(\".head\").change(function() {
var val = $(this).val();
if(!val.match( /.jpg|.gif|.png|.bmp/i ) ){ 
imgtype = false;
alert(\'图片格式无效!\'); 

}else{
if (FileReader) {
var reader = new FileReader(),
file = this.files[0];
reader.onload = function(e) {
var image = new Image();
image.src = e.target.result;
image.onload=function(){
if(image.width > 128 || image.height > 128){
fill = false;
alert(\"头像尺寸应在128x128之间\");
} 

}


};
reader.readAsDataURL(file);
}else{
//这是ie9版本
$(\".preview_size_fake\").show();
var objPreviewSizeFake = $(\".preview_size_fake\").get(0);
var fileupload = $(this).get(0);
fileupload.select();
fileupload.blur();
path = document.selection.createRange().text;

if (/\"\\w\\W\"/.test(path)) {
path = path.slice(1,-1);
}

objPreviewSizeFake.filters.item(\'DXImageTransform.Microsoft.AlphaImageLoader\').src = path; 
if(objPreviewSizeFake.offsetWidth > 128 || objPreviewSizeFake.offsetHeight > 128){
fill = false;
alert(\"头像尺寸应在128x128之间\");
}
document.selection.empty();
}
}
});

css代码(这个是必须写的,如果不写,ie下不起作用)

.preview_size_fake{ /* 该对象只用来在IE下获得图片的原始尺寸,无其它用途 */ 
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=image); 
height: 1px;
visibility:hidden; 
overflow: hidden; 
display: none;
}

html代码:

<input class=\"head\" type=\"file\" name=\"avatar\">
<img class=\"preview_size_fake\" />

本文地址:https://www.stayed.cn/item/25676

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。