JS检测图片大小的实例


Posted in Javascript onAugust 21, 2013
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  <input type="hidden" name="MAX_FILE_SIZE" id="MAX_FILE_SIZE" value="8000000" />
  <input type="file" name="files" id="files"   onchange="checkFileType(this)"/> 
   <script type="text/javascript"> 

var maxSize=document.getElementByIdx_x('MAX_FILE_SIZE').value; 
function checkFileType(obj){
var path=obj.value.toString();
var perfix=path.substring(path.indexOf('.')+1);
var regExp=/(jpg|jpeg|gif|png)/gi;
if(perfix.match(regExp)){
checkFileSize(obj); //如果图片文件类型匹配成功则执行文件大小的检测。
}else{
alert('对不起,请选择图片文件'); return false;
} } 
function checkFileSize(obj){
var img=new Image();
try{
var imgSize=obj.files.item(0).fileSize;
return isLarged(imgSize,maxSize);//图片文件大小比对。
}catch(e){ try{
img.src=obj.value;
return isLarged(img.fileSize,maxSize);
}catch(e){
obj.select();
var path=document.selection.createRange.text();
img.src=path;
return isLarged(img.fileSize,maxSize);
} } } 
function isLarged(imgSize,maxSize){
if(imgSize>maxSize){
alert('对不起,您选择的图片文件超过了'+parseInt(maxSize/1024)+'Kb');
return false;
}else{
alert(parseInt(imgSize/1024)+ 'kb ' + 'This large is OK');
return true;
} } </script>
Javascript 相关文章推荐
JS BASE64编码 window.atob(), window.btoa()
Mar 09 Javascript
用JavaScript对JSON进行模式匹配(Part 1-设计)
Jul 17 Javascript
用JS控制回车事件的代码
Feb 20 Javascript
FireFox下XML对象转化成字符串的解决方法
Dec 09 Javascript
js下拉菜单语言选项简单实现
Sep 23 Javascript
JavaScript Promise启示录
Aug 12 Javascript
快速获取/设置iframe内对象元素的几种js实现方法
May 20 Javascript
JavaScript实现使用Canvas绘制图形的基本教程
Oct 27 Javascript
JavaScript实现图片瀑布流和底部刷新
Jan 02 Javascript
js实现鼠标拖拽多选功能示例
Aug 01 Javascript
angular 实现的输入框数字千分位及保留几位小数点功能示例
Jun 19 Javascript
JS字典Dictionary类定义与用法示例
Feb 01 Javascript
html5的自定义data-*属性和jquery的data()方法的使用示例
Aug 21 #Javascript
JavaScript 中的日期和时间及表示标准介绍
Aug 21 #Javascript
Ext JS 4实现带week(星期)的日期选择控件(实战二)
Aug 21 #Javascript
window.location.href = window.location.href 跳转无反应 a超链接onclick事件写法
Aug 21 #Javascript
Ext JS 4实现带week(星期)的日期选择控件(实战一)
Aug 21 #Javascript
jquery.qrcode在线生成二维码使用示例
Aug 21 #Javascript
jquery设置控件位置的方法
Aug 21 #Javascript
You might like
关于PHP中操作MySQL数据库的一些要注意的问题
2006/10/09 PHP
PHP新建类问题分析及解决思路
2015/11/19 PHP
Javascript 篱式条件判断
2008/08/22 Javascript
jQuery Ajax文件上传(php)
2009/06/16 Javascript
jQuery学习5 jQuery事件模型
2010/02/07 Javascript
javascript针对DOM的应用分析(四)
2012/04/15 Javascript
JSON+JavaScript处理JSON的简单例子
2013/03/20 Javascript
9行javascript代码获取QQ群成员具体实现
2013/10/16 Javascript
淘宝网提供的国内NPM镜像简介和使用方法
2014/04/17 Javascript
Javascript中判断对象是否为空
2015/06/10 Javascript
浅谈js构造函数的方法与原型prototype
2016/07/04 Javascript
详解微信小程序开发—你期待的分享功能来了,微信小程序序新增5大功能
2016/12/23 Javascript
详解Vue 方法与事件处理器
2017/06/20 Javascript
jQuery中extend函数简单用法示例
2017/10/11 jQuery
vue轮播图插件vue-awesome-swiper
2017/11/27 Javascript
安装Node.js并启动本地服务的操作教程
2018/05/12 Javascript
Javascript获取某个月的天数
2018/05/30 Javascript
详解在HTTPS 项目中使用百度地图 API
2019/04/26 Javascript
基于Vue+ElementUI的省市区地址选择通用组件
2019/11/20 Javascript
javascript Canvas动态粒子连线
2020/01/01 Javascript
JavaScript设计模式之观察者模式与发布订阅模式详解
2020/05/07 Javascript
vue-cli3访问public文件夹静态资源报错的解决方式
2020/09/02 Javascript
[02:37]2015国际邀请赛选手档案—LGD.Xiao8
2015/07/28 DOTA
[05:15]2018年度CS GO社区贡献奖-完美盛典
2018/12/16 DOTA
python如何实现int函数的方法示例
2018/02/19 Python
利用python对excel中一列的时间数据更改格式操作
2020/07/14 Python
css3实现图片遮罩效果鼠标hover以后出现文字
2013/11/05 HTML / CSS
Bose法国官网:购买耳机、扬声器、家庭影院、专业音响
2017/12/21 全球购物
Nordgreen台湾官网:极简北欧设计手表
2019/08/21 全球购物
在校生汽车维修实习自我鉴定
2013/09/19 职场文书
房地产销售员的自我评价分享
2013/12/04 职场文书
计算机数据库专业职业生涯规划书
2014/02/08 职场文书
寒假家长评语大全
2014/04/16 职场文书
2014年入党积极分子党校培训心得体会
2014/07/08 职场文书
MySQL单表千万级数据处理的思路分享
2021/06/05 MySQL
Java的Object类的九种方法
2022/04/13 Java/Android