上传图片时,使用JS获得图片文件大小
这个方法用于获得图片文件的大小:
在FF,Chrome,IE6,IE7,IE8可用,不支持IE9+。(如果是IE9就需要flash插件了)
var getSize = function(oFile,callback){
if(oFile.files&&oFile.files.item){
var item = oFile.files.item(0);
if(item.size!==undefined){
callback(item.size);
}else{
callback(item.fileSize);
}
}else{
var img = new Image();
img.src = oFile.value;
var fn = function(){
if(img.readyState === 'complete'){
callback(img.fileSize);
}else{
setTimeout(fn,500);
}
}
fn();
}
}
演示例子:
<html>
<head>
<Meta http-equiv="Content-Type" Content="text/html; Charset=UTF-8">
<title>获得图片文件大小</title>
</head>
<body>
<input id="oFile" type="file" onchange="javascript:onGetFileSize();" />
<span id="oConsole"></span>
<script type="text/javascript">
var onGetFileSize = function(){
var oFile = document.getElementById('oFile');
getSize(oFile,function(fileSize){
document.getElementById('oConsole').innerHTML = fileSize;
});
}
var getSize = function(oFile,callback){
if(oFile.files&&oFile.files.item){
var item = oFile.files.item(0);
if(item.size!==undefined){
callback(item.size);
}else{
callback(item.fileSize);
}
}else{
var img = new Image();
img.src = oFile.value;
var fn = function(){
if(img.readyState === 'complete'){
callback(img.fileSize);
}else{
setTimeout(fn,500);
}
}
fn();
}
}
</script>
</body>
</html>
上传图片时,使用JS获得图片文件大小的更多相关文章
- wordpress上传图片时重命名--修改插件时遇到的一些问题
wordpress是用php语言开发的博客平台,它扩展性强,容易扩展,很适合拿来做二次开发. 1,问题由来 本周五,我在浏览公司的网站(基于wordpress开发)时发现,网站首页上有两篇文章的缩略图 ...
- 调试台自动多出现一个'' ,我 用uploadify上传图片时,在给页面写入一个返回值为图片名称的变量的值的时候值的前面始终多出现一个''
对你有助请点赞,请顶,不好请踩------送人玫瑰,手留余香! 15:54 2016/3/12用uploadify上传图片时,在给页面写入一个返回值为图片名称的变量的值的时候值的前面始终多出现一个' ...
- 上传图片时,使用GDI+中重绘方式将CMYK图片转为RGB图片
原文:上传图片时,使用GDI+中重绘方式将CMYK图片转为RGB图片 我们知道,如果网站上传图片时,如果用户上传的是CMYK图片,那么在网站上将是无法显示的,通常的现象是出现一个红叉.下面使用将Ima ...
- ASP.NET MVC中使用Dropzone.js实现图片的批量拖拽上传
说在前面 最近在做一个MVC相册的网站(这里),需要批量上传照片功能,所以就在网上搜相关的插件,偶然机会发现Dropzone.js,试用了一下完全符合我的要求,而且样式挺满意的,于是就在我的项目中使用 ...
- js压缩图片base64长度
var myCanvas=$('.img-container > img').cropper('getCroppedCanvas'); (function (base64){ var image ...
- 关于 百度 Ueditor 上传图片时 打开文件夹的延迟问题
在使用 ueditor 开发时, 作为一个web文本编辑器使用时. 当点击上传图片时, 文件夹要延迟好久才能打开. 解决: 针对多图片上传, 将/ueditor/dialogs/image/image ...
- Ckeditor与Ckfinder的配合使用,上传图片、水印、修改图片名字为当前日期 asp.net
为了配置出来上传功能,并且还添加水印,修改图片的名字为日期,真的头疼了很久,现在来分享一下自己所做的,也算一点小小的成就吧,顺带帮帮很多还在弄这个的猿们.我是分别用了两种方法.先说低版本的Versio ...
- 百度ueditor上传图片时如何设置默认宽高度
百度ueditor上传图片时如何设置默认宽高度 一.总结 一句话总结:直接css或者js里面限制一下就好,可以用html全局限制一下图片的最大高度 直接css或者js里面限制一下就好,可以用html全 ...
- 前端AntD框架的upload组件上传图片时遇到的一些坑
前言 本次做后台管理系统,采用的是 AntD 框架.涉及到图片的上传,用的是AntD的 upload 组件. 前端做文件上传这个功能,是很有技术难度的.既然框架给我们提供好了,那就直接用呗.结果用的时 ...
随机推荐
- eclipse安装pydev
eclipse是常用的用来写java代码的IDE,但是其实也可以用来写python代码,只需要配置好pydev即可. 第一步 打开eclipse,点击Help,install new sofeware ...
- 【笔记】探索js 的this 对象 (第二部分)
了解this 对象之后 我们明白了this 对象就是指向调用函数的作用域 那么接下来我们便要清除函数究竟在哪个作用域调用 找到调用的作用域首先要了解一下几点: 1.调用栈: 调用栈就是一系列的函数,表 ...
- [Algorithms] Build a Binary Tree in JavaScript and Several Traversal Algorithms
A binary tree is a tree where each node may only have up to two children. These children are stored ...
- Mach-O文件格式和程序从载入到运行过程
> 之前深入了解过.过去了一年多的时间.如今花些时间好好总结下,毕竟好记性不如烂笔头. 其次另一个目的,对于mach-o文件结构.关于动态载入信息那个数据区中,命令含义没有深刻掰扯清除,希望有同 ...
- windows系统中常用的快捷键
开发中,一些常用的键盘技巧: (1)快速切换桌面(alt+tab)或者是(window+tab) (2)迅速关闭当前页面 (3)迅速收起所有页面 (4)直接回到桌面页面 (5)锁定你的屏幕
- JMeter 四:建立高级web测试计划
发送带有Header的请求 参考:http://jmeter.apache.org/usermanual/build-adv-web-test-plan.html#header_manager Jme ...
- HTML5学习笔记简明版(5):input的type超级类型
HTML5为input的type类型添加了多种枚举值,用来表达不同的意思.同事具有验证功能,假设格式不正确,浏览器将原始提供错误提示,堪称超级牛X啊,详细例如以下: Keyword Data type ...
- Php如何返回json数据
php返回json,xml,JSONP等格式的数据 返回json数据: header('Content-Type:application/json; charset=utf-8'); $arr = a ...
- 使用xml-rpc调试openerp模块中的函数
运行openerp模块中的函数 有很多方式, 可以在视图中加个按钮然后点击它, 也可以在集成开发环境中强制执行它. 不过, 用python写个小脚本,xml-rpc调用直接执行它, 无疑是最简便的方法 ...
- Java之基础(1) - 编程中“为了性能”尽量要做到的一些地方
最近的机器内存又爆满了,除了新增机器内存外,还应该好好review一下我们的代码,有很多代码编写过于随意化,这些不好的习惯或对程序语言的不了解是应该好好打压打压了. 下面是参考网络资源总结的一些在Ja ...