<input id="file" type="file">
<input id="Button1" type="button" value="button" onclick="check()">
window.check=function(){
var input = document.getElementById("file");
if(input.files){
//读取图片数据
var f = input.files[0];
var reader = new FileReader();
reader.onload = function (e) {
var data = e.target.result;
//加载图片获取图片真实宽度和高度
var image = new Image();
image.onload=function(){
var width = image.width;
var height = image.height;
alert(width+'======'+height+"====="+f.size);
};
image.src= data;
};
reader.readAsDataURL(f);
}else{
var image = new Image();
image.onload =function(){
var width = image.width;
var height = image.height;
var fileSize = image.fileSize;
alert(width+'======'+height+"====="+fileSize);
}
image.src = input.value; } }

js判断上传图片宽高及文件大小的更多相关文章

  1. js实现未知宽高的元素在指定元素中垂直水平居中

    js实现未知宽高的元素在指定元素中垂直水平居中:本章节介绍一下如何实现未知宽高的元素在指定元素下实现垂直水平居中效果,下面就以span元素为例子,介绍一下如何实现span元素在div中实现水平垂直居中 ...

  2. JS判断上传图片格式是否正确

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  3. js判断上传图片文件大小,尺寸,格式

    /** * 文件宽高 * @param eventId id * @param w 宽度 * @param h 高度 * @param callback 回调函数这里判断图片像素的方法是异步的,所以需 ...

  4. JS/jQ常用宽高及应用

    关于js的宽高,随便一搜就是一大堆.这个一大堆对我来说可不是什么好事,看的头都大了.所以今天就总结了一些比较会常用的,并说明一下应用场景. 先来扯一下documentElement和body的微妙关系 ...

  5. AntDesign VUE:上传组件图片/视频宽高、文件大小、image/video/pdf文件类型等限制(Promise、Boolean)

    文件大小限制 - Promise checkFileSize(file, rules) { return new Promise((resolve, reject) => { file.size ...

  6. JS获取网页宽高方法集合

    JS获取网页宽高等方法的集合:document.body.clientWidth - 网页可见区域宽document.body.clientHeight - 网页可见区域高 document.body ...

  7. 原生JS获取元素宽高实践详解

    开篇的话 任何不是亲身实践中求得的知识,都不是属于你的.任何求得的知识不去时常温习运用,也不是属于你的. 记录由来 在做个上拉广告功能中遇到了一个"理所当然"觉得对的用法,慢慢才排 ...

  8. js中各种宽高

    各种宽高 Javascript: IE中:document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY ...

  9. js获取各种宽高方法

    屏幕的有效宽高: window.screen.availHeightwindow.screen.availWidth 网页可见区域宽:document.body.clientWidth 网页可见区域高 ...

随机推荐

  1. Spring Boot应用中的异常处理

    在普通的单线程程序中,捕获异常只需要通过try ... catch ... finally ...代码块就可以了.那么,在并发情况下,比如在父线程中启动了子线程,如何正确捕获子线程中的异常,从而进行相 ...

  2. 洛谷 P1722 矩阵 II

    题目背景 usqwedf 改编系列题. 题目描述 如果你在百忙之中抽空看题,请自动跳到第六行. 众所周知,在中国古代算筹中,红为正,黑为负…… 给定一个1*(2n)的矩阵(usqwedf:这不是一个2 ...

  3. 「模板」 FHQ_Treap

    「模板」 FHQ_Treap 我也是偶然发现我还没发过FHQ_Treap的板子. 那就发一波吧. 这个速度实在不算快,但是不用旋转,并且好写. 更重要的是,Splay 可以做的事情它都可以做!比如区间 ...

  4. 使用JMeter录制脚本并调试

    仍然以禅道中添加bug为例进行录制 第一步:在JMeter中添加线程组,命名为AddBugByJMeter 第二步:在线程组下添加HTTP请求默认值 添加->配置元件->HTTP请求默认值 ...

  5. Bzoj4481 [Jsoi2015]非诚勿扰

    Time Limit: 20 Sec  Memory Limit: 512 MBSubmit: 147  Solved: 75 Description [故事背景] JYY赶上了互联网创业的大潮,为非 ...

  6. hdu 1016 Prime Ring Problem (素数环)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1016 题目大意:输入一个n,环从一开始到n,相邻两个数相加为素数. #include <iost ...

  7. hadoop2.4.1伪分布式环境搭建

    注意:所有的安装用普通哟用户安装,所以首先使普通用户可以以sudo执行一些命令: 0.虚拟机中前期的网络配置参考: http://www.cnblogs.com/qlqwjy/p/7783253.ht ...

  8. 关于tcp连接对象在多进程中的错误:pickle.PicklingError

    如果需要在多进程中使用tcp连接的对象,那么不能再主进程中将这个对象创建好当做参数传给子进程,因为在创建子进程是需要序列化对象,然而socket对象是不能序列化的,会产生一个pickle.Pickli ...

  9. 嵌入式 uboot引导kernel,kernel引导fs【转】

    转自:http://www.cnblogs.com/lidabo/p/5383934.html#3639633 1.uboot引导kernel: u-boot中有个bootm命令,它可以引导内存中的应 ...

  10. python基础===基于requests模块上的协程【trip】

    今天看博客get了一个有趣的模块,叫做 trip     #(pip install  trip) 兼容2.7版本 基于两大依赖包:TRIP: Tornado & Requests In Pa ...