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 相关文章推荐
jQuery中的常用事件总结
Dec 27 Javascript
下拉菜单点击实现连接跳转功能的js代码
May 19 Javascript
实现动画效果核心方式的js代码
Sep 27 Javascript
HTTP 304错误的详细讲解
Nov 13 Javascript
Angular发布1.5正式版,专注于向Angular 2的过渡
Feb 18 Javascript
微信小程序 animation API详解及实例代码
Oct 08 Javascript
微信小程序 wx:key详细介绍
Oct 28 Javascript
JS定时器实现数值从0到10来回变化
Dec 09 Javascript
纯js实现动态时间显示
Sep 07 Javascript
vue组件Prop传递数据的实现示例
Aug 17 Javascript
vue使用Google地图的实现示例代码
Dec 19 Javascript
使用Typescript开发微信小程序的步骤详解
Jan 12 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
单位速度在实战中的运用
2020/03/04 星际争霸
PHP的SQL注入实现(测试代码安全不错)
2011/02/27 PHP
PHP遍历XML文档所有节点的方法
2015/03/12 PHP
PHP转换文本框内容为HTML格式的方法
2016/07/20 PHP
javascript 伪数组实现方法
2010/10/11 Javascript
JSDoc 介绍使用规范JsDoc的使用介绍
2011/02/12 Javascript
基于jquery的lazy loader插件实现图片的延迟加载[简单使用]
2011/05/07 Javascript
JavaScript Scoping and Hoisting 翻译
2012/07/03 Javascript
基于mouseout和mouseover等类似事件的冒泡问题解决方法
2013/11/18 Javascript
用C/C++来实现 Node.js 的模块(一)
2014/09/24 Javascript
解决js下referer兼容各大浏览器的方法
2014/11/03 Javascript
JS+CSS实现感应鼠标渐变显示DIV层的方法
2015/02/20 Javascript
使用node.js中的Buffer类处理二进制数据的方法
2016/11/26 Javascript
ES6中新增的Object.assign()方法详解
2017/09/22 Javascript
Vue项目中ESlint规范示例代码
2019/07/04 Javascript
javascript实现简单页面倒计时
2021/03/02 Javascript
玩转python爬虫之URLError异常处理
2016/02/17 Python
Python实现的破解字符串找茬游戏算法示例
2017/09/25 Python
详解Python nose单元测试框架的安装与使用
2017/12/20 Python
基于python的ini配置文件操作工具类
2019/04/24 Python
用django-allauth实现第三方登录的示例代码
2019/06/24 Python
Python自动化导出zabbix数据并发邮件脚本
2019/08/16 Python
pygame实现俄罗斯方块游戏(基础篇2)
2019/10/29 Python
python如何基于redis实现ip代理池
2020/01/17 Python
使用python对excel表格处理的一些小功能
2021/01/25 Python
细说CSS3中的选择符
2008/10/17 HTML / CSS
美国汽车性能部件和赛车零件网站:Vivid Racing
2018/03/27 全球购物
大专生工程监理求职信
2013/10/04 职场文书
致跳远、跳高运动员广播稿
2014/01/09 职场文书
励志演讲稿300字
2014/08/21 职场文书
人口与计划生育责任书
2015/05/09 职场文书
总经理聘用协议书
2015/09/21 职场文书
2016新党章学习心得体会
2016/01/15 职场文书
nginx.conf配置文件结构小结
2022/04/08 Servers
科学家测试在太空中培育人造肉,用于未来太空旅行
2022/04/29 数码科技
Go结合Gin导出Mysql数据到Excel表格
2022/08/05 Golang