Question

11.jpg的尺寸不是100*100，但我希望在加载事件中获得图像的真实尺寸。我怎么能这样做？

<img id="t" src="img/11.jpg" width="100px" height="100px" />

$('#t').load(function() {

});

Answer 1

我不一定知道这是最佳方式，或者如果您需要内部img.onload本身，但您可以使用Image对象来获取没有img和width属性的height。

$('#t').load(function() {
    var img = new Image();
    img.src = this.src;

    img.onload = function(){
        console.log(img.width);
        console.log(img.height);
    };
});

演示（让您的控制台处于打开状态）：http://jsfiddle.net/ZgKGG/1/请注意，img标记上的属性会为其提供100x100尺寸，但图片实际为128x128。

Answer 2

使用jQuery，

$(document).ready(function() {
    alert("Widht :" + $("#t").width() + "\nHeight :" + $("#t").height());    
});

使用普通的javaScript

var imgObj = document.getElementById("t");
 alert("Widht :" + imgObj.width + "\nHeight :" + imgObj.height);

如果你想使用jQuery方式，请删除高度和宽度。你的HTML应该是，

<img id="t" src="http://www.gravatar.com/avatar/8953449b7b29d04cb89adaf912d84980?s=32&d=identicon&r=PG" />

试试这个工作示例here

在加载事件中动态获取IMG的维度

2 个答案: