get image height and width in file tag using javascript [duplicate]_问答_开发者

get image height and width in file tag using javascript [duplicate]

开发者 https://www.devze.com 2023-03-18 05:16 出处：网络

This question already has answers here: Closed 11 years ago. Possible Duplicates: get image height and width in file tag javascript

相关专题：javascript

This question already has answers here: Closed 11 years ago.

Possible Duplicates:
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

how can i get the height and width of image without page refresh in file tag?

<HTML>
<HEAD>
    <TITLE></TITLE>
    <script language="javascri开发者_JAVA百科pt">
    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>

i get the image height and width of image using php code, but that time page will be refreshed, without page refresh i get image size but not a height and width....

Use the onload event:

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

You can change the action in the function, for example, making your buttons visible, or un-disabled, up to you.

Not sure I understand your question, but Javascript will need to load the image before you can get its dimensions.

This is impossible to do in a cross-browser way.

The only cross-browser way that comes to my mind (but is not simple) is to upload the file ajax style, render that image (could be hidden) and get its size with img.width and img.height.

Hope this helps. Cheers