js method to obtain the size of images uploaded locally by the front end

How to get the size of the image uploaded on the front end? This article will briefly share with you the js method to obtain the size of images uploaded locally by the front end. I hope it can help you.

var MyTest = document.getElementById("upload_img").
files[0];var reader = new FileReader();
reader.readAsDataURL(MyTest);
reader.onload = function(theFile)
 {　
 　var image = new Image(); 
 　 image.src = theFile.target.result;  
 　   image.onload = function() 
 　   {   
 　   　 alert("图片的宽度为"+this.width+",长度为"+this.height);    };
};

Among them, the tag with the id "upload_img" is as follows:

<input type="file" size="20" autocomplete="off" id="upload_img" name="Uploadfile">

Everyone Have you learned it? Hurry up and give it a try.

Related recommendations:

How to change the size of an image using PHP_PHP tutorial

Detailed explanation of how to get the true size of an image using JavaScript

Share a JS method to obtain image size and preview

The above is the detailed content of js method to obtain the size of images uploaded locally by the front end. For more information, please follow other related articles on the PHP Chinese website!