js 获取图片宽高 和 图片大小
获取要查看大小的img
var img_url = 'http://img5.imgtn.bdimg.com/it/u=4267222417,1017407570&fm=200&gp=0.jpg' // 创建img对象 var img = new Image(); // 改变图片的src img.src = img_url; // 加载完成执行 img.onload = function(){ // 打印 alert('width:'+img.width+',height:'+img.height);获取当前图片的大小
<body>
<img id="image" src="" width="200px" ; height="200px" ;/>
<br/>
<input type="file" onchange="selectImage(this);" />
<br/>
<input type="button" onclick="uploadImage();" value="提交" />
<script>
var image = '';
function selectImage(file) {
console.log(file.files) //输出的数值如下:

console.log(file.files[0].size) //获取大小
输出的是字节 1kb = 1024b 所以想转化的话 就要 parseInt(file.files.size / 1024) // 这样的结果就是kb
if (!file.files || !file.files[0]) {
return;
}
var reader = new FileReader();
reader.onload = function (evt) {
document.getElementById('image').src = evt.target.result;
image = evt.target.result;
}
reader.readAsDataURL(file.files[0]);
}
function uploadImage() { $.ajax({ type: 'POST', url: 'admin.php', data: { image: image }, async: false, dataType: 'json', success: function (data) {
consoel.log(data)
if (data.success) { alert('上传成功'); } else { alert('上传失败'); } }, error: function (err) {
console.log(err)
alert('网络故障'); } }); }
</script>
</body>
js 获取图片宽高 和 图片大小的更多相关文章
- JS获取网页宽高方法集合
JS获取网页宽高等方法的集合:document.body.clientWidth - 网页可见区域宽document.body.clientHeight - 网页可见区域高 document.body ...
- JS获取元素宽高的两种情况
JS获取元素宽高分两种情况, 一.内联样式,也就是直接把width和height写在HTML元素中的style里: 这种情况使用 document.getElementById('xxx'). ...
- 原生JS获取元素宽高实践详解
开篇的话 任何不是亲身实践中求得的知识,都不是属于你的.任何求得的知识不去时常温习运用,也不是属于你的. 记录由来 在做个上拉广告功能中遇到了一个"理所当然"觉得对的用法,慢慢才排 ...
- js获取各种宽高方法
屏幕的有效宽高: window.screen.availHeightwindow.screen.availWidth 网页可见区域宽:document.body.clientWidth 网页可见区域高 ...
- Flutter获取屏幕宽高和Widget大小
我们平时在开发中的过程中通常都会获取屏幕或者 widget 的宽高用来做一些事情,在 Flutter 中,我们可以使用如下方法来获取屏幕或者 widget 的宽高. MediaQuery 一般情况下, ...
- js获取屏幕宽高
最近想自己实现一个全屏滚动. 结果一开始就遇到了问题.因为不知道如何获取一个页面屏幕的高度. 网上所有的博客都是复制粘贴. 网页可见区域宽:document.body.clientWidth 网页可见 ...
- js获取浏览器宽高
IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.d ...
- js获取网页宽高
<script> function getInfo() { var s = ""; s += " 网页可见区域宽:"+ document.body. ...
- js获取浏览器宽高、网页宽高、屏幕宽高、鼠标位置等(带图片说明)
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;(点击查看大图) 网页可见区域宽: document.bo ...
随机推荐
- JavaEE JDBC ResultSet内外移动
ResultSet内外移动 @author ixenos 内外移动指位置光标的移动 内移动就是一个ResultSet得到后的那个光标! 外移动就是多个ResultSet的迭代 内移动 一般的数据库都不 ...
- Light oj-1100 - Again Array Queries,又是这个题,上次那个题用的线段树,这题差点就陷坑里了,简单的抽屉原理加暴力就可以了,真是坑~~
1100 - Again Array Queries ...
- mysqldump快速导数据
MySQL导出的SQL语句在导入时有可能会非常非常慢,经历过导入仅45万条记录,竟用了近3个小时.在导出时合理使用几个参数,可以大大加快导入的速度. -e 使用包括几个VALUES列表的多行INSER ...
- 582. Kill Process
Problem statement: Given n processes, each process has a unique PID (process id) and its PPID (paren ...
- hdu 2642二维树状数组 单点更新区间查询 模板题
二维树状数组 单点更新区间查询 模板 从零开始借鉴http://www.2cto.com/kf/201307/227488.html #include<stdio.h> #include& ...
- MT6755 平台手机皮套驱动实现
是自己写注册一个input device,模仿keypad,在对应的中断处理函数中上报power key的键值. 具体实现代码如下: 在 alps/kernel-3.10/drivers/misc/m ...
- Codeforces679C. Bear and Square Grid
n<=500,n*n的01矩阵,可以选择一个k*k的矩阵全变1,求最大1联通区域. 敢敢n^3..模拟k*k的矩阵的位置,从左到右扫的时候,每变一个位置只会引起边界的信息变化,就记含边界的k*k ...
- hdu - 1195 Open the Lock (bfs) && hdu 1973 Prime Path (bfs)
http://acm.hdu.edu.cn/showproblem.php?pid=1195 这道题虽然只是从四个数到四个数,但是状态很多,开始一直不知道怎么下手,关键就是如何划分这些状态,确保每一个 ...
- P1165 日志分析 洛谷
https://www.luogu.org/problem/show?pid=1165 题目描述 M 海运公司最近要对旗下仓库的货物进出情况进行统计.目前他们所拥有的唯一记录就是一个记录集装箱进出情况 ...
- BZOJ——2190: [SDOI2008]仪仗队
思路: 我们将其所在的位置设为(0,0),那么如果存在一个点(x,y),且有gcd(x,y)=k(k!=1),那么点(x/k,y/k)一定会将(x,y)挡住.而如果k=1,那么点(x,y)就一定会被看 ...