javascript判断上传的文件是否为图片
2018-03-24 16:33:33
1335 次阅读
0 个评论
html5在文件这块新增了FileReader接口,同时对file对象(Blob)进行了升级,可以直接拿到文件的类型和大小,所以若是浏览器版本较高支持FileReader,就可以直接取文件list(h5里file对象为一个list,可以上传多个文件)对象的类型,图片的类型为image/开头,斜杠后面是图片的后缀,所以可以直接以此来判断上传的文件的类型。在不支持FileReader的浏览器里,file对象没有filename.type和filename.size的API,因此我们需要获得文件的后缀,以此来判断文件类型。
if(typeof FileReader != 'undefined'){    
   var file = document.getElementById("imageFile").files[0];    
     if((file.type).indexOf("image/")==-1){  
     swal("提示", "请上传图片!", "warning");  
    }  
}else{  
   var fileName=document.getElementById("imageFile").value;  
   var suffixIndex=fileName.lastIndexOf(".");  
   var suffix=fileName.substring(suffixIndex+1).toUpperCase();  
   if(suffix!="BMP"&&suffix!="JPG"&&suffix!="JPEG"&&suffix!="PNG"&&suffix!="GIF"){  
    swal("提示", "请上传图片(格式BMP、JPG、JPEG、PNG、GIF等)!", "error");  
   }  
    }相关话题
- 正则判断字符是否是中文汉字
 - Fabric.js实作 Node.js 上传图片及操作 Fabricjs 为图片加上浮水印
 - 文件流式上传
 - SpringMVC流式上传文件
 - 坐标距离计算、判断坐标是否在某一多边形内
 - 前端图片压缩与上传OSS组件
 - Apache的commons-net实现FTP的文件上传下载
 - SpringMVC使用StandardServletMultipartResolver上传文件
 - SpringBoot设置上传文件大小
 - Ajax跨域上传文件
 - Java根据时间计算是否为上午、中午、下午以及根据日期获得星期几
 - Java执行Javascript代码
 - Servlet3.0原生API文件上传
 - SpringMVC 配置servlet3.0 文件上传
 - FreeMarker判断空值