js检测上传文件大小

前言：

　　项目中经常用到需要上传文件、照片等功能，同时需要限制所上传文件的大小。很多插件都会采用后台请求验证，前端Js校验比较少。本篇介绍一个前端JS便捷判断上传文件大小的方法。

　　代码很简单，关键就是怎么用JS拿到文件然后获取文件大小，进而去判断拦截。由于各种历史原因，IE的ActiveX控件因素，获取文件的方法可能和其他浏览器有所不同，所以只需稍加判断即可。

JS代码：

<script type="text/javascript">

    // 判断是否为IE浏览器： /msie/i.test(navigator.userAgent) 为一个简单正则

    var isIE = /msie/i.test(navigator.userAgent) && !window.opera;

    function fileChange(target){

        var fileSize = 0;

        if (isIE && !target.files) {    // IE浏览器

            var filePath = target.value; // 获得上传文件的绝对路径

            /**

             * ActiveXObject 对象为IE和Opera所兼容的JS对象

             * 用法：

             *         var newObj = new ActiveXObject( servername.typename[, location])

             *         其中newObj是必选项。返回 ActiveXObject对象 的变量名。

             *        servername是必选项。提供该对象的应用程序的名称。

             *        typename是必选项。要创建的对象的类型或类。

             *        location是可选项。创建该对象的网络服务器的名称。

             *\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\

             *     Scripting.FileSystemObject 为 IIS 内置组件，用于操作磁盘、文件夹或文本文件，

             *    其中返回的 newObj 方法和属性非常的多

             *    如：var file = newObj.CreateTextFile("C:\test.txt", true) 第二个参表示目标文件存在时是否覆盖

             *    file.Write("写入内容");    file.Close();

             */

            var fileSystem = new ActiveXObject("Scripting.FileSystemObject");

            // GetFile(path) 方法从磁盘获取一个文件并返回。

            var file = fileSystem.GetFile(filePath);

            fileSize = file.Size;    // 文件大小，单位：b

        }

        else {    // 非IE浏览器

            fileSize = target.files[0].size;

        }

        var size = fileSize / 1024 / 1024;

        if (size > 1) {

            alert("附件不能大于1M");

        }

    }

</script>

HTML代码

<input type="file"  style="width: 500px;" onchange="fileChange(this);"/>

　　一个简单、轻便、快捷的用JS代码来判断文件大小的方法就OK了，至于ActiveXObject对象感兴趣的可以去深究，它可以根据入参的不同返回不同的对象，通常该对象的功能和作用也是非常有用和强大的。

ps:欢迎转载，转载请注明出处：http://www.cnblogs.com/liuyitian/p/4275430.html

　　　　　　　　　　　　　　　　　　　　　　　　　　写作不易，难免有疏漏和错误，还请慷慨指正，不错请推荐

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　每天多学一点点代码少敲一点点　

js检测上传文件大小的更多相关文章

兼容各浏览器的js判断上传文件大小
由于项目需要,在网上找了一个JS判断上传文件大小的程序,经测试兼容IE6-,Firefox10,Opera11.,safari5.,chrome17 <!DOCTYPE html> < ...
js判断上传文件大小
下面提供三款网页特效判断上传文件大小哦,这三种方法是现在限制文件上传大小比较好的方法,可以在客户上传文件时限制上传文件大小判断处理<!doctype html public "-//w ...
经典JS 判断上传文件大小和JS即时同步电脑时间
我也是新手,还是一个JS笨,有一些网站要实现的功能要自己写么? 答案是不会,去问同事大佬吧,闲简单.就在晚上看了一些其他大佬们写的JS效果, 代码很少.占用网站CPU也小的多.可以一用, 废话少扯.代 ...
js 限定上传文件大小类型
方案1 :限定大小 <html> <head> <script type="text/javascript"> var isIE = /ms ...
js判断上传文件的类型和大小
//检测文件大小和类型 function fileChange(target){ //检测上传文件的类型 if(!(/(?:jpg|gif|png|jpeg)$/i.test(target.value ...
asp.net修改上传文件大小
我们大家都知道ASP.NET为我们提供了文件上传服务器控件FileUpload,默认情况下可上传的最大文件为4M,如果要改变可上传文件大小限制,那么我们可以在web.config中的httpRunti ...
js 文件上传进度条
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
js实现上传文件夹
上传大文件的解决方案需求:项目要支持大文件上传功能,经过讨论,初步将文件上传大小控制在500M内,因此自己需要在项目中进行文件上传部分的调整和配置,自己将大小都以501M来进行限制. 第一步: 前端 ...
js限制上传文件类型和大小
<html> <head> <script type="text/javascript"> function fileChange(target ...

随机推荐

C++操作mysql方法总结（3）
C++通过mysql++操作mysql的方式使用vs2013和64位的msql 5.6.16进行操作项目中使用的数据库名和表数据请参考C++操作mysql方法总结(1)中的介绍 Mysql ...
英文词频统计的java实现方法
需求概要 1.读取文件,文件内包可含英文字符,及常见标点,空格级换行符. 2.统计英文单词在本文件的出现次数 3.将统计结果排序 4.显示排序结果分析 1.读取文件可使用BufferedReader ...
Git Github使用错误汇总
Git使用常见错误 error:failed to push some refs to 'xxx' 本地仓库没有Readme文件,先PULL下远程仓库 git pull --rebase origin ...
Spyder & Python
Spyder & Python https://pypi.org/project/spyder/ Spyder is a powerful scientific environment wri ...
IE下Userdata本地化存储
这两天看了下Discuz x2发帖的实时保存机制,涉及到本地化存储,所以上网查了下,Firefox等支持HTML5的浏览器使用window.localStorage或window.sessionSto ...
Java 继承和多态
Java 继承和多态 Java 继承继承的概念继承是java面向对象编程技术的一块基石,因 ...
ava8并发教程：Threads和Executors
原文地址原文作者:Benjamin Winterberg 译者:张坤欢迎阅读我的Java8并发教程的第一部分.这份指南将会以简单易懂的代码示例来教给你如何在Java8中进行并发编程.这是一系列教 ...
vyos 基础配置
vyos 基础配置 http://www.lowefamily.com.au/2015/11/29/using-a-vyos-router-with-hyper-v/1/http://thomasvo ...
【python】爬虫实践
参考链接 https://blog.csdn.net/u012662731/article/details/78537432 详解 python3 urllib https://www.jianshu ...
UOJ #126 【NOI2013】快餐店
题目链接:快餐店震惊!某ZZ选手此题调了一天竟是因为……>>点击查看一般碰到这种基环树的题都要先想想树上怎么做.这道题如果是在树上的话……好像求一遍直径就做完了?答案就是直径长度的一半 ...

js检测上传文件大小

js检测上传文件大小的更多相关文章

随机推荐

热门专题