首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

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

2012-11-07 
JavaScript 验证上传图片(长宽,大小,格式)!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//E

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   建议如果验证不通过时,选择图片的文本框内容清空。

热点排行