jquery - 在 jQuery 和 PrototypeJS 中查找未知的图像尺寸

Question

我想在 px 中找出这个图像的尺寸。

在 jQuery 中

var h = $("img").height();
var w = $("img").width();
alert(h +"px", w +"px");

在 PrototypeJS 中

var h = $('img').getHeight();
var w = $('img').getWidth();
alert(h);
alert(w);

使用这两个我得到每个图像的尺寸为 20px 和 1350px，它们的原始尺寸不同。

Answer 1

所以你想获得图像的实际大小，而不是它呈现给网络浏览器的大小？如果是这种情况，这些代码可能会对您有所帮助：

var img = new Image();
img.onload = function() {
  alert(this.width + 'x' + this.height);
}
img.src = $("#myimg").attr('src');

此处参考：如何使用 jQuery 获取实际图像宽度和高度？

Answer 2

这是因为$('img')将针对您的 DOM 中的每个图像，20px并且1350px是您的第一张图像的尺寸。在这种情况下，您需要使用each() ：

$("img").each(function() {
    $(this).click(function() {
        var w = $(this).width(),
            h = $(this).height();
        alert(h +"px " + w +"px");
    });
});

小提琴

但我建议你给你的图像一个类，而不是仅仅选择纯<img>标签：

<img class="image" />

然后你可以这样做：

$(".image").click(function() {
    var w = $(this).width(),
        h = $(this).height();
    alert(h +"px " + w +"px");
});

小提琴