How to get the real size of an image in jquery

How to get the true size of the image in jquery: 1. Method 1 [.attr("src", $(''#imgid").attr("src"))]; 2. Method 2 [ theImage.src = $(''#imgid").attr( "src");].

The operating environment of this tutorial: windows10 system, jquery2.2.4, this article is applicable to all brands of computers.

How to get the true size of the image in jquery:

The first one:

$("<img/>") // Make in memory copy of image to avoid css issues  在内存中创建一个img标记
    .attr("src", $(&#39;&#39;#imgid").attr("src"))
    .load(function() {
        pic_real_width = this.width;   // Note: $(this).width() will not
        pic_real_height = this.height; // work for in memory images.
    });

The second one:

var theImage = new Image(); 
theImage.src = $(''#imgid").attr( "src"); 
alert( "Width: " + theImage.width); 
alert( "Height: " + theImage.height);

One is more secure and is guaranteed to be obtained after the image is loaded.

Related free learning recommendations: JavaScript (video)

The above is the detailed content of How to get the real size of an image in jquery. For more information, please follow other related articles on the PHP Chinese website!