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

原创 2016年05月30日 10:33:42

如果你想快速解决这个问题,看本文就够了。查了好多资料,终于解决了,太耗时间了,本文留给给后来者,希望你们工作的更轻松

本文保存为.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>

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

input type='file'上传图片限制大小,类型判断,以及原生js实现上传至后端前实现图片显

做项目时遇到了图片上传的问题,就专门学习了下,经查阅,总结得到如上实例,如上的结果都已经验证。 由于时间原因就简单粘贴图片了,错误之处请批评指正。谢谢
  • zjbkzj
  • zjbkzj
  • 2017-04-12 15:21
  • 3677

【Js应用实例】限制上传图片大小

前端页面开发中,常遇到图片上传的需求,一般要求限制图片格式及大小,这里就把实现此功能所需代码贴出来,供同志们参考,也方便我以后复用。 功能要点:1.处理 类型type为file的输入元素的value值...

前端js限制上传文件类型及大小(1)

var isIE = /msie/i.test(navigator.userAgent) && !window.opera; function fileChange(target,id) { va...

用HTML的File控件上传图片,用JS判断和限制图片格式、类型、尺寸

function CheckFile(f,p) { //判断图片尺寸 var img=null; img=document.createElement("img"); document.bo...

html5上传图片限制大小

参考:http://www.linuxidc.com/Linux/2012-06/63635.htm html界面:type=“file”类型的jq:$('input[type=file]').ea...

js限制上传文件的大小

最近使用到一个文件上传功能,发现恶意上传一个2G文件时,后台处理响应较慢,遂想到能否使用js来进行客户端的验证。但查阅网上多处资料,均使用 ActiveXObject("Scripting.FileS...

js上传图片进行预览、验证格式及尺寸

var flag = 0; /** * 校验表单 */ function checkForm(){ var idcard =document.getElementById("servertype...

js获取上传图片真实的尺寸大小和存储大小

window.check=function(){ var input = document.getElementById("file"); if(input.files){ ...

使用js实现上传图片的大小限制

使用struts2的上传文件方式做的上传图片,但是遇到一个问题就是在前端js中怎么判断上传图片的大小,找了好久无意间发现了这个很好用。 if(file.files[0].size>2097152){ ...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)