js判断上传文件大小 (尝试网上解决方案后结果....)
来源:互联网 发布:高洛峰 php教程 编辑:程序博客网 时间:2024/05/01 13:32
最近使用到一个文件上传功能,发现恶意上传一个2G文件时,后台处理响应较慢,遂想到能否使用js来进行客户端的验证。但查阅网上多处资料,均使用 ActiveXObject("Scripting.FileSystemObject"); 的方法,该方法需要将Internet选项中安全级别提高,启用一个系统本身不推荐的选项,会出现如下非常不友好的提示:
所以这边并没有用到,而是寻求其他方法。
这边新的思路是img标签中的dynsrc属性。
在FireFox、Chrome浏览器中可以根据document.getElementById(“id_file”).files[0].size 获取上传文件的大小(字节数),而IE浏览器中不支持该属性,只能借助<img>标签的dynsrc属性,来间接实现获取文件的大小(但需要同意ActiveX控件的运行,但是不会引起上面的不友好、不安全的提示)。
具体方法如下:
转自 http://www.micmiu.com/lang/javascript/js-check-filesize/
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta name="DEscription" contect="my code demo" />
- <meta name="Author" contect="Michael@www.micmiu.com" />
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>js check file size @ www.micmiu.com</title>
- </head>
- <body>
- <img id="tempimg" dynsrc="" src="" style="display:none" />
- <input type="file" name="file" id="fileuploade" size="40" />
- <input type="button" name ="check" value="checkfilesize" onclick="checkfile()"/>
- </body>
- <script type="text/javascript">
- var maxsize = 2*1024*1024;//2M
- var errMsg = "上传的附件文件不能超过2M!!!";
- var tipMsg = "您的浏览器暂不支持计算上传文件的大小,确保上传文件不要超过2M,建议使用IE、FireFox、Chrome浏览器。";
- var browserCfg = {};
- var ua = window.navigator.userAgent;
- if (ua.indexOf("MSIE")>=1){
- browserCfg.ie = true;
- }else if(ua.indexOf("Firefox")>=1){
- browserCfg.firefox = true;
- }else if(ua.indexOf("Chrome")>=1){
- browserCfg.chrome = true;
- }
- function checkfile(){
- try{
- var obj_file = document.getElementById("fileuploade");
- if(obj_file.value==""){
- alert("请先选择上传文件");
- return;
- }
- var filesize = 0;
- if(browserCfg.firefox || browserCfg.chrome ){
- filesize = obj_file.files[0].size; //如果用jquery是obj_file[0]
- }else if(browserCfg.ie){
- var obj_img = document.getElementById('tempimg');
- obj_img.dynsrc=obj_file.value;
- filesize = obj_img.fileSize;
- }else{
- alert(tipMsg);
- return;
- }
- if(filesize==-1){
- alert(tipMsg);
- return;
- }else if(filesize>maxsize){
- alert(errMsg);
- return;
- }else{
- alert("文件大小符合要求");
- return;
- }
- }catch(e){
- alert(e);
- }
- }
- </script>
- </html>
测试上传的文件大小:
IE8:
Chrome(19.0.1084.56 m):
FF(11.0):
网上找到这种方法后进行上传测试,IE8 报错Error:无法设置dynsrc属性。拒绝访问.如果用大写的DYNSRC,就不会报错,但是后面的fileSize就不能用了
最后上传文件还是改成使用jquery uploadify的方式上传了
0 0
- js判断上传文件大小 (尝试网上解决方案后结果....)
- js判断上传文件大小 (尝试网上解决方案后结果....)
- js判断上传文件大小
- js判断上传文件大小
- js判断上传文件大小
- JS判断上传文件大小
- js判断上传文件大小
- js判断上传文件大小
- js 判断上传文件大小
- js判断上传文件大小
- js判断上传文件大小
- js判断上传文件大小
- js判断上传文件大小
- 使用JS判断上传文件大小
- 使用JS判断上传文件大小
- JS判断文件大小是否上传
- js客户端判断文件大小限制上传
- 文件上传时 js判断文件大小是否合法
- ios 单例模式的写法
- C语言 指针的新理解
- 15-StringBuffer-10-常用对象API(StringBuffer类-插入&删除&查找&修改)
- [J2EE]命令行删除、安装tomcat服务器
- 计蒜客 难题题库 221 N的-2进制表示
- js判断上传文件大小 (尝试网上解决方案后结果....)
- isis协议第一个Hello包
- 泛型的for循环
- 黑马程序员-集合框架(一)
- 设计模式之-----职责链模式
- 锂电池的充电电压和电流应该是多少
- 计蒜客 难题题库 222 疲倦程度
- 15-StringBuffer-12-常用对象API(StringBuilder类)
- ffmpeg视频相关名词解释