?javascript如何控制上传文件的大小

2020-03-19 16:00:31来源:爱站网 阅读 ()

容器云强势上线!快速搭建集群,上万Linux镜像随意使用

有时候我们在上传文件的时候回发现文件太大而导致无法上传,那么你知道?javascript如何控制上传文件的大小吗?下面我们就跟小编一起去看看javascript控制上传文件的大小的方法。

?

<form???name=Myform??onsubmit="return???CheckFileSize()">????
??<input???type=file???name=photo><br/>????
??<input???type=submit???value=submit></form>????

??<SCRIPT???LANGUAGE="JavaScript"><!--????
??function???CheckFileSize()????
??{????
??????var???s???=???document.Myform.photo.value;????
??????if(s=="?")return???false;????
??????var???img???=???new???Image();????
??????img.src???=???s;????
??????alert("高???=???"+???img.height???+???"\n宽???=???"+???img.width);????
??????alert("fileSize???=???"+???img.fileSize???+"???字节");????
??????return???false;????
??}????
??//--></SCRIPT>???


应用了javascript和在IE下img本身的fileSize属性。另外img还有其他的几个属性,如fileCreatedDate、fileModifiedDate、fileSize、fileUpdatedDate、filters,我们可以通过这些属性来获取图片文件的部分信息,如文件大小,我们用file表单同img标签结合,就能够在上传之前判断图片文件的大小是否合法了。

?

?

?


<input?type="text"?size="4"?value="10"?name="fileSizeLimit"?id="fileSizeLimit"/>?K?
<input?type="file"?name="file1"?id="file1"?size="40"?onchange="changeSrc(this)"/>?
<img?src="about:blank"?id="fileChecker"?alt="test"?height="18"/>?

<script?type="text/javascript">?
var?oFileChecker?=?document.getElementById("fileChecker");?

function?changeSrc(filePicker)?
{?
oFileChecker.src?=?filePicker.value;?
}?

oFileChecker.onreadystatechange?=?function?()?
{?
if?(oFileChecker.readyState?==?"complete")?
{?
checkSize();?
}?
}?

function?checkSize()?
{?
var?limit?=?document.getElementById("fileSizeLimit").value?*?1024;?

if?(oFileChecker.fileSize?>?limit)?
{?
alert("too?large");?
}?
else?
{?
alert("ok");?
}?
}?
</script>?

?

?

?


function???CheckFileSize()????
??{????
?????var?FileMaxSize?=?100;//限制上传的文件大小,单位(k)?
??????var???s???=???document.RegForm.Img_1.value;???
??????//if(s==""){alert("No?image,please?select?again!");document.RegForm.Img_1.focus();?return???false;}????
??????var???img???=???new???Image();????

??????img.src???=???s;??

?????if(img.fileSize>FileMaxSize*1024){alert("The?file?size?exceeds?"+FileMaxSize+"K,please?choose?a?smaller?one!");document.RegForm.Img_1.focus();return?false;}?

??//--></SCRIPT>????
<FORM?action="**.asp"?method="post"?onSubmit="return?CheckFileSize()"?enctype="multipart/form-data"?name="RegForm">?
<input?name="Next"?type="submit"?class="pBttn"?id="Next"?value="Save">

看完爱站技术频道小编的详细介绍我想大家肯定对学习JavaScript更加感兴趣了,想要学习的朋友们,赶快把javascript如何控制上传文件的大小的内容收入囊中吧!


原文链接:https://js.aizhan.com/develop/JavaScript/12182.html
如有疑问请与原作者联系

标签:JavaScript文件

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:Js中如何使用sort()

下一篇:根据分辨率调用css文件的方法