获取要查看大小的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 获取图片宽高 和 图片大小的更多相关文章

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

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

  2. JS获取元素宽高的两种情况

    JS获取元素宽高分两种情况, 一.内联样式,也就是直接把width和height写在HTML元素中的style里: 这种情况使用     document.getElementById('xxx'). ...

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

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

  4. js获取各种宽高方法

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

  5. Flutter获取屏幕宽高和Widget大小

    我们平时在开发中的过程中通常都会获取屏幕或者 widget 的宽高用来做一些事情,在 Flutter 中,我们可以使用如下方法来获取屏幕或者 widget 的宽高. MediaQuery 一般情况下, ...

  6. js获取屏幕宽高

    最近想自己实现一个全屏滚动. 结果一开始就遇到了问题.因为不知道如何获取一个页面屏幕的高度. 网上所有的博客都是复制粘贴. 网页可见区域宽:document.body.clientWidth 网页可见 ...

  7. js获取浏览器宽高

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

  8. js获取网页宽高

    <script> function getInfo() { var s = ""; s += " 网页可见区域宽:"+ document.body. ...

  9. js获取浏览器宽高、网页宽高、屏幕宽高、鼠标位置等(带图片说明)

    网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;(点击查看大图) 网页可见区域宽: document.bo ...

随机推荐

  1. PLSQLDeveloper安装与配置(详细图文)

    PLSQLDeveloper安装与配置(详细图文) 听语音 | 浏览:21912 | 更新:2016-10-24 17:12 1 2 3 4 5 6 7 分步阅读 在公司做项目时需要使用PLSQL D ...

  2. CALayer之 customizing timing of an animation

    customizing timing of an animation Timing is an important part of animations, and with Core Animatio ...

  3. [bzoj1934/2768][Shoi2007]Vote 善意的投票_最小割

    Vote 善意的投票 bzoj-1934 Shoi-2007 题目大意:题目链接. 注释:略. 想法: 这是最小割的一个比较基本的模型. 我们将所有当前同意的小朋友连向源点,边权为1.不容易的连向汇点 ...

  4. P1547 Out of Hay 洛谷

    https://www.luogu.org/problem/show?pid=1547 题目背景 奶牛爱干草 题目描述 Bessie 计划调查N (2 <= N <= 2,000)个农场的 ...

  5. BNU2017校赛

    A(模拟) 题意:求一个特殊图的最大流 分析:画画图发现就是for循环扫一遍 B(LCA) 题意:有n个点组成的树,有q个询问,每个询问(A,B,C),学生从B点走最短路径走到C点,再从C点走到根节点 ...

  6. Ubuntu 16.04重启输入法

    一般使用搜狗输入法,但是偶尔不太稳定会挂掉,但是可以通过以下脚本重启: pidof fcitx | xargs kill pidof sogou-qimpanel | xargs kill nohup ...

  7. Ubuntu 16.04安装Markdown编辑器MarkMyWords

    继上一篇文章http://www.cnblogs.com/EasonJim/p/7119345.html中使用Sublime Text 3进行Markdown的编辑,总觉得操作上比较繁琐,现在推荐使用 ...

  8. Spring Boot为我们准备了最佳的数据库连接池方案,只需要在属性文件(例如application.properties)中配置需要的连接池参数即可。

    Spring Boot为我们准备了最佳的数据库连接池方案,只需要在属性文件(例如application.properties)中配置需要的连接池参数即可.

  9. OJ-online judegement

    OJ-online judegement https://baike.baidu.com/item/OJ/8129019?fr=aladdin

  10. 鼠标滚轮插件jQuery mousewheel

    delta的值是负的即-1,那么滚轮就是向下滚动.正的1就是向上. 插件方法: 1.为了监听滚轮事件,该插件引入了mousewheel事件.所以我们能够监听元素的mousewheel事件 2.该插件还 ...