Display image and jQuery heights

Question

<input type="file" class="test" name="vend_logo" id="vend_logo"> $('.test').bind('change', function() { var file = files[0] var img = new Image(); var width = img.width;alert(width); }); 

I wanted to warn that the width and height of the image were loaded. How can i do this? I used clientwidth as well as naturalwidth , but it does not display the correct value.

Answer 1

You can do something like this

 $('.test').bind('change', function() { if (file = this.files[0]) { img = new Image(); img.onload = function() { var width = this.width; alert(width); }; img.src = window.URL.createObjectURL(file); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <input type="file" class="test" name="vend_logo" id="vend_logo"> 

Link: Check image width and height before loading using Javascript