怎么在js 里面限制上传图片的大小不能超过 1M？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了怎么在js 里面限制上传图片的大小不能超过 1M？相关的知识，希望对你有一定的参考价值。
用<input type="file">上传一张图片，怎么在js 获取图片是多少 kb ,并限制图片的大小不能超过1M才允许上传？
这样设置的：
1、先用form标签创建一个上传的表单。
<p><input type="hidden" name="MAX_FILE_SIZE" value="100000" /></p>
<p><input name="userfile" id="userfile" type="file" onchange="check()"/></p>
</form>
2、用javascript设置格式和大小。
||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*1) alert("图片大小在1M以内，为："+imagSize/(1024*1024)+"M"); return true; else alert(\'请选择格式为*.jpg、*.gif、*.bmp、*.png、*.jpeg 的图片\');// return false; </script>
图片超过1M则不能上传 如图：
如何利用JS或者CSS样式来自动调整图片大小
RT，图片是用HTML编辑器上传到数据库的，提取出的时候，直接将<img src="图片">这个代码提取出来，这种情况怎么控制图片的大小，使图片不会超过表格大小，缩放时也不能变形。
js版和css版自动按比例调整图片大小方法，分别如下：
<title>javascript图片大小处理函数</title><script language=Javascript>
var proMaxHeight = 150;
var proMaxWidth = 110;
function proDownImage(ImgD)
var image=new Image();
image.src=ImgD.src;
if(image.width>0 && image.height>0)
var rate = (proMaxWidth/image.width < proMaxHeight/image.height)?proMaxWidth/image.width:proMaxHeight/image.height;
if(rate <= 1)
ImgD.width = image.width*rate;
ImgD.height =image.height*rate;
else
ImgD.width = image.width;
ImgD.height =image.height;
</script>
</head>
<body>
<img src="999.jpg" border=0 onload=proDownImage(this); />
<img src="room.jpg" border=0 onload=proDownImage(this); />
</body>
纯css的防止图片撑破页面的代码，图片会自动按比例缩小：
<style type="text/css">.content-width MARGIN: auto;WIDTH: 600px;
.content-width imgMAX-WIDTH: 100%!important;HEIGHT: auto!important;width:expression(this.width > 600 ? "600px" : this.width)!important;
</style>
<div class="content-width">
<p><img src="/down/js/images/12567247980.jpg"/></p>
<p><img src="/down/js/images/12567247981.jpg"/></p>
</div> 参考技术A 这个使用CSS可以控制，一般看你的图片是哪种比例的，如果不想图片变形的话，只设置宽或者高，如：
img width:50px; 或者 imgheight:50px;
这样的结果是，图片本身的大小并没有改变，但这个img标签显示出来的图片是被压缩显示的。
利用JS来调整的原理是：获得图片的宽和高，然后去与父容器的宽高相比，取比例大的来父容器值对img进行样式设置，比如：图片宽/父容器宽 = 3， 图片高/父容器高 = 2，那么取父容器的宽，把这个值通过JS设置给img标签。本回答被提问者采纳 参考技术B 2楼的能够解决CSS控制图片尺寸的问题，但是还不够灵活，我在他的基础上补充一下，
可以这样，如果你的图片的最大宽度不能超过600
只要在CSS里面加句就可以
#content imgmax-width:600px;
以上是关于怎么在js 里面限制上传图片的大小不能超过 1M？的主要内容，如果未能解决你的问题，请参考以下文章
kindeditor批量上传，怎么更改一次性上传图片的数量和图片大小限制呢？
Nginx# 上传图片大小限制反向代理MySQL反向代理Redis