Question

可能重复：
  get image height and width in file tag javascript
  Determining image file size + dimensions via Javascript?
  How to upload preview image before upload through JavaScript

如何在文件标签中没有页面刷新的情况下获得图像的高度和宽度？

<HTML>
<HEAD>
    <TITLE></TITLE>
    <script language="javascript">
    function getW()
    {
        var theImg = document.getElementById('testimg');
        alert(theImg.width);
    }

    function getH()
    {
        var theImg = document.getElementById('testimg');
        alert(theImg.height);
    }
    </script>
</HEAD>

<BODY>        
<input type="file" id="testimg"/>
    <input type="button" value="get Width" onclick="getW()"/>
    <input type="button" value="get Height" onclick="getH()"/>
</BODY>
</HTML>

我使用php代码获取图像的图像高度和宽度，但该时间页面将刷新，没有页面刷新我得到图像大小但不是高度和宽度....

Answer 1

使用onload事件：

document.getElementById('testimg').onload = function() {
  alert(document.getElementById('testimg').offsetHeight);
}

您可以更改功能中的操作，例如，使您的按钮可见或取消禁用，直至您。

我不确定我是否理解您的问题，但Javascript需要先加载图片才能获得尺寸。

Answer 2

这不可能以跨浏览器的方式进行。

我想到的唯一跨浏览器方式（但并不简单）是上传文件ajax样式，渲染该图像（可隐藏）并使用img.width和{{1}获取其大小}}

希望这会有所帮助。干杯

使用javascript获取文件标记中的图像高度和宽度

2 个答案: