博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js限制本地上传文件大小(支持ie6,7,8 firefox 谷歌)
阅读量:4983 次
发布时间:2019-06-12

本文共 2161 字,大约阅读时间需要 7 分钟。

首先 对于ie 必须使用ActiveXObject 来访问本地文件。 这就需要将浏览器的 安全级别调低。 然后重点就是如何在ie8获取本地路径。

 

[html]
  1. <input id="upload_img" type="file" onchange="onUploadImgChange(this)" />    
 

 

 

[javascript]
  1.   fileInput.select();  
  2.   var url = document.selection.createRange().text;  
  3.   $('#imageTest').attr('src',url);  
  4. try{  
  5.    var fso = new ActiveXObject("Scripting.FileSystemObject");     
  6.     }  
  7. catch(e)  
  8. {  
  9.     alert('如果你用的是ie8 请将安全级别调低!');  
  10.     }  
  11.   alert("文件大小为:"+fso.GetFile(url).size);  
fileInput.select();			   var url = document.selection.createRange().text;			   $('#imageTest').attr('src',url);				try{				   var fso = new ActiveXObject("Scripting.FileSystemObject");   					}				catch(e)				{					alert('如果你用的是ie8 请将安全级别调低!');					}			   alert("文件大小为:"+fso.GetFile(url).size);
而对于 firefox 谷歌等新一代的浏览器 直接可以通过fileInput.files 来获取file的对象数组

 

 

[javascript]
  1. if( fileInput.files &&  fileInput.files[0] ){  
  2.  alert(fileInput);  
  3.  alert( fileInput.files[0])  
  4.  alert('你选择的文件大小'+fileInput.files[0].size);  
  5.  var xx=fileInput.files[0];  
  6.  for(var i in xx)  
  7. {  
  8.         alert (xx[i])  
  9. }  
  10. }  
if( fileInput.files &&  fileInput.files[0] ){			 alert(fileInput);			 alert( fileInput.files[0])			 alert('你选择的文件大小'+fileInput.files[0].size);			 var xx=fileInput.files[0];			 for(var i in xx)			{					alert (xx[i])			}		 }
下面是一个完成的测试例子。

 

[html]
  1. <input id="upload_img" type="file" onchange="onUploadImgChange(this)" />  
  2.   
  3. <script type="text/javascript">  
  4.     function onUploadImgChange(fileInput) {  
  5.         var filePath = fileInput.value;  
  6.         var fileExt = filePath.substring(filePath.lastIndexOf("."))  
  7.                 .toLowerCase();  
  8.   
  9.         if (!checkFileExt(fileExt))  
  10.   
  11.         {  
  12.             alert("您上传的文件不是图片,请重新上传!");  
  13.             return;  
  14.         }  
  15.         if (fileInput.files && fileInput.files[0]) {  
  16.             alert(fileInput);  
  17.             alert(fileInput.files[0])  
  18.             alert('你选择的文件大小' + fileInput.files[0].size);  
  19.             var xx = fileInput.files[0];  
  20.             for ( var i in xx) {  
  21.                 alert(xx[i])  
  22.             }  
  23.         } else {  
  24.             fileInput.select();  
  25.             var url = document.selection.createRange().text;  
  26.             try {  
  27.                 var fso = new ActiveXObject("Scripting.FileSystemObject");  
  28.             } catch (e) {  
  29.                 alert('如果你用的是ie 请将安全级别调低!');  
  30.             }  
  31.             alert("文件大小为:" + fso.GetFile(url).size);  
  32.         }  
  33.     }  
  34.     function checkFileExt(ext)  
  35.   
  36.     {  
  37.         if (!ext.match(/.jpg|.gif|.png|.bmp/i)) {  
  38.             return false;  
  39.         }  
  40.         return true;  
  41.     }  
  42. </script>  

转载于:https://www.cnblogs.com/Nina-piaoye/archive/2013/04/16/3023972.html

你可能感兴趣的文章
SQL 03
查看>>
IE6和IE7中border渲染断线现象
查看>>
Python源码分析
查看>>
Git超简洁教程
查看>>
centos搭建本地yum源码
查看>>
Creating Hyperv Agent Installer
查看>>
JasperReports报表变量13
查看>>
CSS:列表样式(设置列表项的标志图案/位置)
查看>>
常用网站
查看>>
java学习笔记之面向对象多态
查看>>
[Java]随记--HttpClient发送put请求
查看>>
ASP.NET-第六天-HTML基础
查看>>
Win7系统下进行WinCE程序开发时,不能生成SDK的问题
查看>>
编译linux内核
查看>>
java基础-泛型举例详解
查看>>
Entityframework Migrations
查看>>
LeetCode Range Sum Query Immutable
查看>>
01 lucene基础 北风网项目培训 Lucene实践课程 索引
查看>>
how to download the source tree for a specific Android code-line
查看>>
北京鱼乐贝贝面试题
查看>>