博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js验证上传图片的尺寸
阅读量:5910 次
发布时间:2019-06-19

本文共 1401 字,大约阅读时间需要 4 分钟。

  hot3.png

//js对上传图片的长宽进行验证

//js方法如下:

function getImageSize(obj){    var filemessage=document.getElementById("filemessage");    var _file=document.getElementById("file");        var i=_file.value.lastIndexOf('.');        var len=_file.value.length;        var extEndName=_file.value.substring(i+1,len);        var extName="GIF,BMP,JPG,JPEG,SWF";//首先对格式进行验证        if(extName.indexOf(extEndName.toUpperCase())==-1){            filemessage.innerHTML="*您只能输入"+extName+"格式的文件"        }else{             if(extEndName.toUpperCase()=='SWF'){//对swf文件不限制大小,因为下边是自己手动限制的                filemessage.innerHTML="文件有效";             }else{                 var url,image;                if(obj.files){                   url=obj.files[0].getAsDataURL();                }else{                   url=obj.value;                   url="file:///"+url;                }                image=new Image();                image.src=url;                image.onload=function(){                  if(image.width>985||image.height>123){                   filemessage.innerHTML="*提示:文件大小不对。您只能上传985*123尺寸的图片或者swf文件";                  }else{                   filemessage.innerHTML="文件有效";                  }                }             }        } }

html中调用:
<input type="file" name="file" id="file" οnchange="getImageSize(this)"/>
 <span id="filemessage">*图片或者swf文件(980*123)</span>//用于显示提示信息或者错误信息

转载于:https://my.oschina.net/HJCui/blog/678165

你可能感兴趣的文章
Objective-C equivalent of Java Vector/ ArrayList
查看>>
事件的好处~实现对修改的封闭,对扩展的开放!~续
查看>>
详解 ML2 Core Plugin(I) - 每天5分钟玩转 OpenStack(71)
查看>>
OC多态
查看>>
python爬虫中文网页cmd打印出错问题解决
查看>>
dos.orm
查看>>
Entityframework core 动态添加模型实体
查看>>
一周规划汇总_2016-09-18
查看>>
leetcode70
查看>>
前端组件化Polymer入门教程(3)——快速入门
查看>>
iOS移动开发周报-第22期
查看>>
libyuv 编译 for android
查看>>
Makefile-入门与进阶【转】
查看>>
V-rep学习笔记:机器人逆运动学数值解法(Cyclic Coordinate Descent Method)
查看>>
[Java基础] Java中List.remove报错UnsupportedOperationException
查看>>
2016年开源巨献:来自百度的71款开源项目
查看>>
session再次理解
查看>>
好领导:提升领导威信力的110个管理奥秘
查看>>
部署eolinker开源版接口管理
查看>>
从MySQL临时表谈到filesort
查看>>