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的一点点认识总结《javascript高级程序设计》读书笔记
Nov 30 Javascript
基于JQuery实现的图片自动进行缩放和裁剪处理
Jan 31 Javascript
js字符串完全替换函数分享
Dec 03 Javascript
Javascript中实现trim()函数的两种方法
Feb 04 Javascript
js省市县三级联动效果实例
Apr 15 Javascript
浅谈js构造函数的方法与原型prototype
Jul 04 Javascript
Bootstrap CSS组件之分页(pagination)和翻页(pager)
Dec 17 Javascript
Angular 实现输入框中显示文章标签的实例代码
Nov 07 Javascript
vue axios请求频繁时取消上一次请求的方法
Nov 10 Javascript
Vue组件内部实现一个双向数据绑定的实例代码
Apr 04 Javascript
原生js代码能实现call和bind吗
Jul 31 Javascript
为什么node.js不适合大型项目
Apr 28 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
用PHP发电子邮件
2006/10/09 PHP
PHP编程实现csv文件导入mysql数据库的方法
2017/04/29 PHP
搜索附近的人PHP实现代码
2018/02/11 PHP
laravel5.2表单验证,并显示错误信息的实例
2019/09/29 PHP
基于jquery的cookie的用法
2011/01/10 Javascript
JavaScript的漂亮的代码片段
2013/06/05 Javascript
推荐 21 款优秀的高性能 Node.js 开发框架
2014/08/18 Javascript
js中document.write的那点事
2014/12/12 Javascript
微信小程序 出现47001 data format error原因解决办法
2017/03/10 Javascript
layer.open关闭父窗口 以及调用父页面的方法
2018/08/17 Javascript
Bootstrap的aria-label和aria-labelledby属性实例详解
2018/11/02 Javascript
Vue中的vue-resource示例详解
2018/11/02 Javascript
vue页面更新patch的实现示例
2020/03/25 Javascript
Vue 事件的$event参数=事件的值案例
2021/01/29 Vue.js
[01:14:10]2014 DOTA2国际邀请赛中国区预选赛 SPD-GAMING VS Orenda
2014/05/22 DOTA
python中定义结构体的方法
2013/03/04 Python
python读取json文件并将数据插入到mongodb的方法
2015/03/23 Python
Python 字典与字符串的互转实例
2017/01/13 Python
Python基于列表list实现的CRUD操作功能示例
2018/01/05 Python
Python unittest单元测试框架总结
2018/09/08 Python
Python3爬虫爬取百姓网列表并保存为json功能示例【基于request、lxml和json模块】
2018/12/05 Python
Pandas0.25来了千万别错过这10大好用的新功能
2019/08/07 Python
基于Django集成CAS实现流程详解
2020/11/28 Python
pycharm 2020.2.4 pip install Flask 报错 Error:Non-zero exit code的问题
2020/12/04 Python
花园仓库建筑:Garden Buildings Direct
2018/02/16 全球购物
新奥尔良珠宝:Mignon Faget
2020/11/23 全球购物
什么是Smarty变量操作符?如何使用Smarty变量操作符
2014/07/18 面试题
中间件分为哪几类
2012/03/14 面试题
婚礼证婚人证婚词
2014/01/13 职场文书
运动会广播稿200字
2014/01/15 职场文书
贷款委托书范本
2014/04/08 职场文书
求职信标题怎么写
2014/05/26 职场文书
代办社保委托书范文
2014/10/06 职场文书
公司员工辞职信范文
2015/05/12 职场文书
预备党员入党思想汇报(范文)
2019/08/14 职场文书
基于Go Int转string几种方式性能测试
2021/04/28 Golang