你的位置:首页 > Java教程

[Java教程]web前端对上传的文件进行类型大小判断的js自定义函数


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html ="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>web前端对上传的文件进行类型大小判断的js自定义函数</title></head><body>    <form>    <input type="file" id="fileId">     <input type="button" value = "提交" onclick="checkFileSizeAndType(10*1024*1024,['gif','jpg','png'],'fileId');">  </form>  <script>  //参数说明  //maxSize 代表允许最大上传的文件大小,单位是字节  //allowType 代表允许上传的文件类型(后缀)   //fileId  代表input type=file 框 的id  function checkFileSizeAndType(maxSize,allowType,fileId) {        //默认大小        if(!maxSize){          maxSize=10*1024*1024;        }        //默认类型        if(!allowType){          allowType=new Array('jpg','png');          }        //js通过id获取上传的文件对象        var file = document.getElementById(fileId);              var types =allowType;                var fileInfo = file.files[0];        if(!fileInfo){          alert("请选择文件!");          return false;        }        var fileName = fileInfo.name;                //获取文件后缀名        var file_typename = fileName.substring(            fileName.lastIndexOf('.') + 1, fileName.length);                //定义标志是否可以提交上传        var isUpload = true;        //定义一个错误参数:1代表大小超出 2代表类型不支持        var errNum =0;        if (fileInfo) {          if (fileInfo.size > maxSize) {            isUpload = false;            errNum=1;          } else {            for ( var i in types) {              if (types[i] == file_typename) {                isUpload = true;                return isUpload;              } else {                isUpload = false;                errNum=2;              }            }          }        }        //对错误的类型进行对应的提示        if (!isUpload) {          if(errNum==1){            var size = maxSize/1024/1024;            alert("上传的文件必须为小于"+size+"M的图片!");          }else if(errNum==2){            alert("上传的"+file_typename+"文件类型不支持!只支持"+types.toString()+"格式");          }else{            alert("没有选择文件");          }          file.value="";          return isUpload;                          }      }    </script></body></html>

还有很多不足的地方,大家多多提意见喔!