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 相关文章推荐
国外的为初学者写的JavaScript教程
Jun 09 Javascript
基于jQuery的消息提示插件 DivAlert之旅(二)
Apr 01 Javascript
jQuery创建DOM元素实例解析
Jan 19 Javascript
JavaScript中setMonth()方法的使用详解
Jun 11 Javascript
第九章之路径分页标签与徽章组件
Apr 25 Javascript
解析AngularJS中get请求URL出现的跨域问题
Dec 01 Javascript
使用jQuery实现两个div中按钮互换位置的实例代码
Sep 21 jQuery
Angular4.x通过路由守卫进行路由重定向实现根据条件跳转到相应的页面(推荐)
May 10 Javascript
详解vue文件中使用echarts.js的两种方式
Oct 18 Javascript
JS实现TITLE悬停长久显示效果完整示例
Feb 11 Javascript
vue 通过绑定事件获取当前行的id操作
Jul 27 Javascript
Javascript Symbol原理及使用方法解析
Oct 22 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
基于mysql的bbs设计(三)
2006/10/09 PHP
解析web文件操作常见安全漏洞(目录、文件名检测漏洞)
2013/06/29 PHP
php相对当前文件include其它文件的方法
2015/03/13 PHP
PHP常用函数之根据生日计算年龄功能示例
2019/10/21 PHP
Jquery AutoComplete自动完成 的使用方法实例
2010/03/19 Javascript
善用事件代理,警惕闭包的性能陷阱。
2011/01/20 Javascript
从零学JSON之JSON数据结构
2014/05/19 Javascript
jQuery 插件开发指南
2014/11/14 Javascript
原生js页面滚动延迟加载图片
2015/12/20 Javascript
AngularJS上拉加载问题解决方法
2016/05/23 Javascript
前端开发必知的15个jQuery小技巧
2017/01/22 Javascript
微信小程序侧边栏滑动特效(左右滑动)
2017/01/23 Javascript
JS实现线性表的顺序表示方法示例【经典数据结构】
2017/04/11 Javascript
webpack配置文件和常用配置项介绍
2017/04/28 Javascript
vue 如何添加全局函数或全局变量以及单页面的title设置总结
2017/06/01 Javascript
JavaScript闭包_动力节点Java学院整理
2017/06/27 Javascript
React-Native左右联动List的示例代码
2017/09/21 Javascript
使用百度地图实现地图网格的示例
2018/02/06 Javascript
浅谈VUE-CLI脚手架热更新太慢的原因和解决方法
2018/09/28 Javascript
微信小程序如何刷新当前界面的实现方法
2019/06/07 Javascript
python利用hook技术破解https的实例代码
2013/03/25 Python
python执行使用shell命令方法分享
2017/11/08 Python
hmac模块生成加入了密钥的消息摘要详解
2018/01/11 Python
Python Json序列化与反序列化的示例
2018/01/31 Python
python tkinter基本属性详解
2019/09/16 Python
用Python 执行cmd命令
2020/12/18 Python
Python 实现二叉查找树的示例代码
2020/12/21 Python
求职简历的自我评价怎样写好
2013/10/07 职场文书
新郎婚宴答谢词
2014/01/19 职场文书
信息管理应届生求职信
2014/03/07 职场文书
工程力学专业自荐信范文
2014/03/17 职场文书
毕业生自荐信如何写
2014/03/24 职场文书
新员工试用期自我鉴定
2014/04/17 职场文书
教师节倡议书
2014/08/30 职场文书
2015年政治教研组工作总结
2015/07/22 职场文书
浅谈Redis的事件驱动模型
2022/05/30 Redis