JavaScript对上传的文件进行大小和格式的校验

JavaScript对上传的文件进行大小和格式的校验

 

1.页面代码：

<form id="uploadFileform" action="$!{request.contextPath}/user/uploadImage" method="post"
 enctype="multipart/form-data" >
      <center>
        <label id="Header" cssClass="HeaderText" value="图片上传" />
          <hr style="size: 1" />
           <p id="FileList">
	   <input id="uploadImage" value="" type="file" name="uploadImage" size="50" />
           </p>
	  <hr style="size: 1" />
          <p>温馨提示：只允许上传.jpg .gif .png 后缀的图片</p>
          <p style="color:green;">(请务必上传真实证件照片或图片 否则不会通过认证)</p>
          <p>
           <input class="btn btn-primary" type="button"  value="上传图片" onclick="uploadImages();"/>
          </p>
	  <hr style="size: 1" />
          </center>
          <p align="center">
          <span class="GbText" style="width: 100%; color: red;"></span>
          </p>
	  
</form>

 

 

2.Js代码：

function uploadImages() {
    var str = $("#uploadImage").val();
	if(str.length!=0){
	   var reg = ".*\\.(jpg|png|gif|JPG|PNG|GIF)";
	   var r = str.match(reg);
	   if(r == null){
		alert("对不起，您的图片格式不正确，请重新上传");
	   }
	   else {
		if(window.ActiveXObject) {  
    		var image=new Image();
      		image.dynsrc=str;
    		   if(image.fileSize>5243000){
    		      alert("上传的图片大小不能超过5M，请重新上传");
    		      return false;
    		   }
    	        }
    		else{  
    		   var size = document.getElementById("uploadImage").files[0].size;
    		   if(size>5243000) {
    			alert("上传的图片大小不能超过5M，请重新上传");
    			return false;
    		   }
    		}
		$('#uploadFileform').submit();
	   }
	}
	else {
	   alert("请先上传图片");
	}
}