js验证上传图片的尺寸

最新推荐文章于 2024-06-10 18:16:43 发布

weixin_33743703

最新推荐文章于 2024-06-10 18:16:43 发布

阅读量70

点赞数

CC 4.0 BY-SA版权

原文链接：https://my.oschina.net/HJCui/blog/678165

本文介绍了一个JavaScript函数，用于验证用户上传的图片是否符合指定的尺寸要求。该方法能够检查文件类型，并对GIF、BMP、JPG、JPEG和SWF格式的文件进行尺寸验证。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

为什么80%的码农都做不了架构师？>>>

//js对上传图片的长宽进行验证
//js方法如下：

function getImageSize(obj){
    var filemessage=document.getElementById("filemessage");
    var _file=document.getElementById("file");
        var i=_file.value.lastIndexOf('.');
        var len=_file.value.length;
        var extEndName=_file.value.substring(i+1,len);
        var extName="GIF,BMP,JPG,JPEG,SWF";//首先对格式进行验证
        if(extName.indexOf(extEndName.toUpperCase())==-1){
            filemessage.innerHTML="*您只能输入"+extName+"格式的文件"
        }else{
             if(extEndName.toUpperCase()=='SWF'){//对swf文件不限制大小，因为下边是自己手动限制的
                filemessage.innerHTML="文件有效";
             }else{
                 var url,image;
                if(obj.files){
                   url=obj.files[0].getAsDataURL();
                }else{
                   url=obj.value;
                   url="file:///"+url;
                }
                image=new Image();
                image.src=url;
                image.onload=function(){
                  if(image.width>985||image.height>123){
                   filemessage.innerHTML="*提示：文件大小不对。您只能上传985*123尺寸的图片或者swf文件";
                  }else{
                   filemessage.innerHTML="文件有效";
                  }
                }
             }
        }
 }

html中调用：
<input type="file" name="file" id="file" οnchange="getImageSize(this)"/>
<span id="filemessage">*图片或者swf文件(980*123)</span>//用于显示提示信息或者错误信息

转载于:https://my.oschina.net/HJCui/blog/678165