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 相关文章推荐
javascript 定义新对象方法
Feb 20 Javascript
Javascript中Eval函数的使用
Mar 23 Javascript
javascript 数据类型转换(parseInt,parseFloat)
Jul 20 Javascript
对比分析json及XML
Nov 28 Javascript
js与jquery实时监听输入框值的oninput与onpropertychange方法
Feb 05 Javascript
jQuery实现自动滚动到页面顶端的方法
May 22 Javascript
JAVASCRIPT代码编写俄罗斯方块网页版
Nov 26 Javascript
AngularJS自定义服务与fliter的混合使用
Nov 24 Javascript
JavaScript两个变量交换值的实现方法
Mar 01 Javascript
Angular2开发环境搭建教程之VS Code
Dec 15 Javascript
Webpack的dll功能使用
Jun 28 Javascript
原生js实现贪吃蛇游戏
Oct 26 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
apache和php之间协同工作的配置经验分享
2013/04/08 PHP
CI框架(ajax分页,全选,反选,不选,批量删除)完整代码详解
2016/11/01 PHP
Laravel 5.1 框架Blade模板引擎用法实例分析
2020/01/04 PHP
才发现的超链接js导致网页中GIF动画停止的解决方法
2007/11/02 Javascript
Javascript UrlDecode函数代码
2010/01/09 Javascript
javascript中的继承实例代码
2011/04/27 Javascript
JavaScript中为元素加上name属性的方法
2011/05/09 Javascript
使用Jquery搭建最佳用户体验的登录页面之记住密码自动登录功能(含后台代码)
2011/07/10 Javascript
jQuery使用Selectator插件实现多选下拉列表过滤框(附源码下载)
2016/04/08 Javascript
Javascript简写条件语句(推荐)
2016/06/12 Javascript
jQuery插件easyUI实现通过JS显示Dialog的方法
2016/09/16 Javascript
vue 自定义组件 v-model双向绑定、 父子组件同步通信的多种写法
2017/11/27 Javascript
vue项目,代码提交至码云,iconfont的用法说明
2020/07/30 Javascript
如何利用vue实现波谱拟合详解
2020/11/05 Javascript
Python实现partial改变方法默认参数
2014/08/18 Python
Python中的Numpy矩阵操作
2018/08/12 Python
Python3.4解释器用法简单示例
2019/03/22 Python
Python3.5装饰器原理及应用实例详解
2019/04/30 Python
python和js交互调用的方法
2020/06/23 Python
python中判断数字是否为质数的实例讲解
2020/12/06 Python
html5画布旋转效果示例
2014/01/27 HTML / CSS
处理HTML5新标签的浏览器兼容版问题
2017/03/13 HTML / CSS
HTML5中的Web Notification桌面通知功能的实现方法
2019/07/29 HTML / CSS
Ellos丹麦:时尚和服装在线
2016/09/19 全球购物
一个精品风格的世界:Atterley
2019/05/01 全球购物
金士达面试非笔试
2012/03/14 面试题
自我鉴定200字
2013/10/28 职场文书
学生保证书范文
2014/04/28 职场文书
团结就是力量演讲稿
2014/05/21 职场文书
南京南京观后感
2015/06/02 职场文书
七年级之开学家长寄语35句
2019/09/05 职场文书
浅谈Python魔法方法
2021/06/28 Java/Android
Redis监控工具RedisInsight安装与使用
2022/03/21 Redis
python中filter,map,reduce的作用
2022/06/10 Python
java实现web实时消息推送的七种方案
2022/07/23 Java/Android
Moment的feature导致线上bug解决分析
2022/09/23 Javascript