JavaScript 验证下传图片(长宽,大小,格式)-JavaSript-爱易网页

JavaScript 验证下传图片(长宽,大小,格式)

日期：2014-05-16　浏览次数：20389 次

JavaScript 验证上传图片(长宽,大小,格式)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    
<html xmlns="http://www.w3.org/1999/xhtml">    
<head>    
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />    
  <title>无标题文档</title>    
  <script>    
      UpLoadFileCheck=function()    
      {      
          this.AllowExt=".jpg,.gif,.bmp,.png";//允许上传的文件类型 0为无限制    
          this.AllowImgFileSize=0;//允许上传文件的大小 0为无限制 单位：KB    
          this.AllowImgWidth=300;//允许上传的图片的宽度 0为无限制　单位：px    
          this.AllowImgHeight=300;//允许上传的图片的高度 0为无限制　单位：px    
          this.ImgObj=new Image();    
          this.ImgFileSize=0;    
          this.ImgWidth=0;    
          this.ImgHeight=0;    
          this.FileExt="";    
          this.ErrMsg="";    
          this.IsImg=false;    
        
      }    
  
      UpLoadFileCheck.prototype.CheckExt=function(obj)    
      {    
          this.ErrMsg="";    
          this.ImgObj.src=obj.value;      
          if(obj.value=="")    
          {    
              this.ErrMsg="\n请选择一个文件";        
          }    
          else    
          {      
              this.FileExt=obj.value.substr(obj.value.lastIndexOf(".")).toLowerCase();    
              if(this.AllowExt!=0&&this.AllowExt.indexOf(this.FileExt)==-1)    
              {    
                  this.ErrMsg="\n该文件类型不允许上传";      
              }    
          }    
          if(this.ErrMsg!="")    
          {    
              this.ShowMsg(this.ErrMsg,false);    
              return false;    
          }    
          else      
              return this.CheckProperty(obj);        
      }    
  
      UpLoadFileCheck.prototype.CheckProperty=function(obj)    
      {            
          if(this.IsImg==true)    
          {    
              thisthis.ImgWidth=this.ImgObj.width;    
              thisthis.ImgHeight=this.ImgObj.height;    
              if(this.AllowImgWidth!=0&&this.AllowImgWidth<this.ImgWidth)    
                  thisthis.ErrMsg=this.ErrMsg+"\n图片宽度超过限制。请上传宽度小于"+this.AllowImgWidth+"px的文件";    
  
              if(this.AllowImgHeight!=0&&this.AllowImgHeight<this.ImgHeight)    
                  thisthis.ErrMsg=this.ErrMsg+"\n图片高度超过限制。请上传高度小于"+this.AllowImgHeight+"px的文件";      
          }    
  
          this.ImgFileSize=Math.round(this.ImgObj.fileSize/1024*100)/100;    
          if(this.AllowImgFileSize!=0&&this.AllowImgFileSize<this.ImgFileSize)    
              thisthis.ErrMsg=this.ErrMsg+"\n文件大小超过限制。请上传小于"+this.AllowImgFileSize+"KB的文件";    
  
          if(this.ErrMsg!="")    
          {    
              this.ShowMsg(this.ErrMsg,false);    
              return false;    
          }    
          else    
              return true;    
      }    
  
      UpLoadFileCheck.prototype.ShowMsg=function(msg,tf)    
      {    
          alert(msg);    
      }    
        
      function c(obj)    
      {    
          var d=new UpLoadFileCheck();    
          d.IsImg=true;    
          d.AllowImgFileSize=100;    
          d.CheckExt(obj)    
      }    
  </script>    
</head>    
<body>    
  <input name="" type="file"   onchange="c(this)"/>    
</body>    
</html>

1 楼 qq642617822 2011-01-04

建议如果验证不通过时，选择图片的文本框内容清空。

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

JavaScript 验证下传图片(长宽,大小,格式)

相关资料更多>

推荐阅读更多>