To get image height and width of uploaded image before form submission

我们两清 提交于 2019-12-22 01:09:43

问题


How to get an uploaded image's height and width before form submission, using jQuery or Javascript?

<input type="file" />

I need to check whether the width and height of the image to be uploaded are equal to the selected width and height. I have found this link. But it's only working for FF and Chrome, not in IE7 and IE8.

Can anyone show me any other way to get the dimensions so that it's working in all browsers?


回答1:


You can create an image object, After creating image object get the image from the image tag which is showing the image to be uploaded and then you can get the dimension of the image by following method written ahead.

var v=new Image();
v.src=document.getElementById("up_img").getAttribute('src');
alert(v.width);

Remember you will have to use the Base64 method to get the image to be displayed in the image tag, i don't know whether it is supported in ie or not but it is the HTML5 facility available in Chrome ,Firefox, Opera.




回答2:


For security reasons IE9, IE8, IE7 do not support accessing files on the client's computer; that's why you are not getting any width or height. You would need to upload the image onto your server and then display it to some image control and get the height and width. You can set visibility:hidden if you don't want the image to be visible.

BIRD'S VIEW

One way could be that on upload, you show a progress bar while using Ajax to save the file to a temporary folder on your server with the image name as a temporary ID and store the ID in the database (so that you can delete it later) and then display it in the image control. Then get the height and width.



来源:https://stackoverflow.com/questions/11272218/to-get-image-height-and-width-of-uploaded-image-before-form-submission

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!