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 相关文章推荐
服务端 VBScript 与 JScript 几个相同特性的写法 By shawl.qiu
Mar 06 Javascript
JavaScript入门教程(8) Location地址对象
Jan 31 Javascript
Html中JS脚本执行顺序简单举例说明
Jun 19 Javascript
javascipt基础内容--需要注意的细节
Apr 10 Javascript
jQuery如何实现点击页面获得当前点击元素的id或其他信息
Jan 09 Javascript
jQuery中add()方法用法实例
Jan 08 Javascript
JavaScript ES6的新特性使用新方法定义Class
Jun 28 Javascript
jQuery实现动态文字搜索功能
Jan 05 Javascript
Vue2 Vue-cli中使用Typescript的配置详解
Jul 24 Javascript
Vue列表渲染的示例代码
Nov 01 Javascript
判断文字超过2行添加展开按钮,未超过则不显示,溢出部分显示省略号
Apr 28 Javascript
vue实现学生信息管理系统
May 30 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集成FCK的函数代码
2008/09/27 PHP
xml在joomla表单中的应用详解分享
2012/07/19 PHP
php实现网页缓存的工具类分享
2015/07/14 PHP
利用PHP扩展Xhprof分析项目性能实践教程
2018/09/05 PHP
PHP基于openssl实现的非对称加密操作示例
2019/01/11 PHP
代码精简的可以实现元素圆角的js函数
2007/07/21 Javascript
JS Excel读取和写入操作(模板操作)实现代码
2010/04/11 Javascript
jquery ajaxSubmit 异步提交的简单实现
2014/02/28 Javascript
js+css实现回到顶部按钮(back to top)
2016/03/02 Javascript
vue.js+boostrap项目实践(案例详解)
2016/09/21 Javascript
JavaScript实现Fly Bird小游戏
2016/12/15 Javascript
Bootstrap按钮组简单实现代码
2017/03/06 Javascript
node结合swig渲染摸板的方法
2018/04/11 Javascript
angular将html代码输出为内容的实例
2018/09/30 Javascript
react 组件传值的三种方法
2019/06/03 Javascript
ionic4+angular7+cordova上传图片功能的实例代码
2019/06/19 Javascript
VUE解决 v-html不能触发点击事件的问题
2019/10/28 Javascript
vue监听滚动事件的方法
2020/12/21 Vue.js
Python命令行参数解析模块getopt使用实例
2015/04/13 Python
python将数组n等分的实例
2019/12/02 Python
Python log模块logging记录打印用法解析
2020/01/20 Python
python爬虫开发之Beautiful Soup模块从安装到详细使用方法与实例
2020/03/09 Python
pandas dataframe 中的explode函数用法详解
2020/05/18 Python
python gui开发——制作抖音无水印视频下载工具(附源码)
2021/02/07 Python
香港个人化生活购物网站:Ballyhoo Limited
2016/09/10 全球购物
阿联酋彩妆品牌:OUD MILANO
2019/10/06 全球购物
机电专业体育教师求职信
2013/09/21 职场文书
新入职员工的自我介绍演讲稿
2014/01/02 职场文书
无刑事犯罪记录证明
2014/09/18 职场文书
机关副主任个人四风问题整改措施
2014/09/26 职场文书
2014村党支部书记党建工作汇报材料
2014/11/02 职场文书
房屋分割离婚协议书范本
2014/12/01 职场文书
顶岗实习计划书
2015/01/16 职场文书
教师年终个人总结
2015/02/11 职场文书
2019年大学生暑期社会实践调查报告模板
2019/11/07 职场文书
浅谈golang package中init方法的多处定义及运行顺序问题
2021/05/06 Golang