js上传文件(图片)限制格式及大小为3M

Posted xzzzys

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js上传文件(图片)限制格式及大小为3M相关的知识,希望对你有一定的参考价值。

 

本文保存为.html文件用浏览器打开即可测试功能

 

<form id="form1" name="form1" method="post" action="" enctype="multipart/form-data">
 <p><input type="hidden" name="MAX_FILE_SIZE" value="100000" /></p>
 <p><input name="userfile" id="userfile" type="file" onchange="check()"/></p>


</form>


<script language="javascript" type="text/javascript">
  function check()
    {
var aa=document.getElementById("userfile").value.toLowerCase().split(‘.‘);//以“.”分隔上传文件字符串
   // var aa=document.form1.userfile.value.toLowerCase().split(‘.‘);//以“.”分隔上传文件字符串
       
    if(document.form1.userfile.value=="")
    {
        alert(‘图片不能为空!‘);
        return false;
    }
    else
    {
    if(aa[aa.length-1]==‘gif‘||aa[aa.length-1]==‘jpg‘||aa[aa.length-1]==‘bmp‘

||aa[aa.length-1]==‘png‘||aa[aa.length-1]==‘jpeg‘)//判断图片格式
    {
var imagSize =  document.getElementById("userfile").files[0].size;
alert("图片大小:"+imagSize+"B")
if(imagSize<1024*1024*3)
        alert("图片大小在3M以内,为:"+imagSize/(1024*1024)+"M");
        return true;
    }
    else
    {
        alert(‘请选择格式为*.jpg、*.gif、*.bmp、*.png、*.jpeg 的图片‘);//jpg和jpeg格式是一样的只是系统Windows认jpg,Mac OS认jpeg,

//二者区别自行百度
        return false;
    }
    }
    }
  </script>





































以上是关于js上传文件(图片)限制格式及大小为3M的主要内容,如果未能解决你的问题,请参考以下文章

webuploader上传文件错误提示

iview实现文件上传 限制上传格式大小

支付宝小程序上传包文件过大怎么解决?

百度上传控件webuploader如何限制 图片尺寸大小

上传图片限制大小类型判断像素判断

js前端验证上传的文件大小及格式