jQuery统计上传文件大小的方法


Posted in Javascript onJanuary 24, 2015

本文实例讲述了jQuery统计上传文件大小的方法。分享给大家供大家参考。具体如下:

对于现代浏览器(支持html5)来说,在客户端统计上传文件的大小,可以通过$(selector)[0].files[0].size来实现。但在老版本的IE浏览器中,比如IE7,IE8或IE9,却不支持这种做法,但可以借助ActiveXObject对象来实现。

<input type="file" name="f" id="f" value="上传文件"/>

<input type="button" value="获取上传图片的大小" id="g"/>

@section scripts

{

    <script type="text/javascript">

        $(function() {

            $('#g').on("click", function() {

                getFileSize("f");

            });

        });

        function getFileSize(eleId) {

            try {

                var size = 0;

               

                if ($.browser.msie) {//ie旧版浏览器

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

                    var filePath = $('#' + eleId)[0].value;

                    var fileObj = fileMgr.getFile(filePath);

                    size = fileObj.size; //byte

                    size = size / 1024;//kb

                    //size = size / 1024;//mb

                } else {//其它浏览器

                    size = $('#' + eleId)[0].files[0].size;//byte

                    size = size / 1024;//kb

                    //size = size / 1024;//mb

                }

                alert('上传文件大小为' + size + 'kb');

            } catch (e) {

                alert("错误:" + e);

            } 

        }

    </script>

}

补充:

在IE中启用ActiveXObject按如下做法:

→工具
→Internet选项
→安全
→自定义级别,启用ActiveXObject

jQuery统计上传文件大小的方法

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
prototype与jquery下Ajax实现的差别
Sep 13 Javascript
document.getElementBy(&quot;id&quot;)与$(&quot;#id&quot;)有什么区别
Sep 22 Javascript
利用JS进行图片的切换即特效展示图片
Dec 03 Javascript
解决js函数闭包内存泄露问题的办法
Jan 25 Javascript
WebGL利用FBO完成立方体贴图效果完整实例(附demo源码下载)
Jan 26 Javascript
学习Angularjs分页指令
Jul 01 Javascript
JavaScript脚本语言是什么_动力节点Java学院整理
Jun 26 Javascript
JavaScript实现简单图片轮播效果
Aug 21 Javascript
Vue实现可移动水平时间轴
Jun 29 Javascript
javascript实现简易计算器功能
Sep 23 Javascript
vant-ui框架的一个bug(解决切换后onload不触发)
Nov 11 Javascript
一篇文章看懂JavaScript中的回调
Jan 05 Javascript
限制上传文件大小和格式的jQuery插件实例
Jan 24 #Javascript
jQuery将所有被选中的checkbox某个属性值连接成字符串的方法
Jan 24 #Javascript
使用jQuery实现input数值增量和减量的方法
Jan 24 #Javascript
Javascript 拖拽雏形中的一些问题(逐行分析代码,让你轻松了拖拽的原理)
Jan 23 #Javascript
Javascript 拖拽雏形(逐行分析代码,让你轻松了拖拽的原理)
Jan 23 #Javascript
Javascript 拖拽的一些简单的应用(逐行分析代码,让你轻松了拖拽的原理)
Jan 23 #Javascript
Javascript 完美运动框架(逐行分析代码,让你轻松了运动的原理)
Jan 23 #Javascript
You might like
phpmyadmin中配置文件现在需要绝密的短语密码的解决方法
2007/02/11 PHP
PHP 透明水印生成代码
2012/08/27 PHP
php指定函数参数默认值示例代码
2013/12/04 PHP
php冒泡排序、快速排序、快速查找、二维数组去重实例分享
2014/04/24 PHP
PHP常用数组函数介绍
2014/07/28 PHP
php数组添加与删除单元的常用函数实例分析
2015/02/16 PHP
用HTML/JS/PHP方式实现页面延时跳转的简单实例
2016/07/18 PHP
PHP快速推送微信模板消息
2017/04/14 PHP
javascript编程起步(第七课)
2007/01/10 Javascript
锋利的jQuery jQuery中的DOM操作
2010/03/21 Javascript
jQuery判断密码强度实现思路及代码
2013/04/24 Javascript
javaScript函数中执行C#代码中的函数方法总结
2013/08/07 Javascript
Jquery遍历节点的方法小集
2014/01/22 Javascript
实现无刷新联动例子汇总
2015/05/20 Javascript
JavaScript下的时间格式处理函数Date.prototype.format
2016/01/27 Javascript
浅析Ajax语法
2016/12/05 Javascript
JavaScript实现分页效果
2017/03/28 Javascript
Angularjs根据json文件动态生成路由状态的实现方法
2017/04/17 Javascript
react项目如何使用iconfont的方法步骤
2019/03/13 Javascript
js实现简单的贪吃蛇游戏
2020/04/23 Javascript
python的类变量和成员变量用法实例教程
2014/08/25 Python
pyinstaller打包opencv和numpy程序运行错误解决
2019/08/16 Python
python防止随意修改类属性的实现方法
2019/08/21 Python
Python 文件数据读写的具体实现
2020/01/24 Python
Python3 元组tuple入门基础
2020/02/09 Python
如何使用repr调试python程序
2020/02/28 Python
CSS3制作彩色进度条样式的代码示例分享
2016/06/23 HTML / CSS
竞争上岗演讲稿
2014/01/05 职场文书
关于爱国的演讲稿
2014/05/07 职场文书
好书伴我成长演讲稿
2014/05/14 职场文书
三年级上册科学教学计划
2015/01/21 职场文书
2015年小班保育员工作总结
2015/05/27 职场文书
当幸福来敲门观后感
2015/06/01 职场文书
2016春季小学开学寄语
2015/12/03 职场文书
mysql 联合索引生效的条件及索引失效的条件
2021/11/20 MySQL
CSS3实现指纹特效代码
2022/03/17 HTML / CSS