javascript - 使用 javascript / jquery 获取上传的图像尺寸？

Question

也试试这个，但对我来说它不起作用。

我上传图片，通过 jquery 将其插入页面，并想围绕插入的图片创建 div，但不知道图片尺寸。

$("#temp_image").html('<img src="uploads/obr1.jpg" alt="" id="tmp" />');
var img = document.getElementById('temp_image');
alert(img.clientWidth);

它告诉我 0，怎么了？

也试过：

var oImg = new Image();
oImg.src = 'uploads/obr1.jpg;
if (oImg.complete) {
  alert(oImg.width)
}

它也向我显示 0。

哪里有问题？谢谢

score 0 · Accepted Answer

应该：

$("#temp_image").html('<img src="uploads/obr1.jpg" alt="" id="tmp" />');
var img = document.getElementById('tmp');
alert(img.clientWidth);

您当前正在尝试获取包含 div (#temp_image) 的宽度，而不是图像。

此外，如果您使用的是 jQuery，您可以这样做：

$("#temp_image").html('<img src="uploads/obr1.jpg" alt="" id="tmp" />');
alert($('#tmp').width());

希望这可以帮助！

score 0 · Accepted Answer

var img = document.getElementById('temp_image');

实际上并没有为您获取图像元素，而是获取包含图像的元素。你应该试试

var img = document.getElementById('tmp');

或者

var img = $('#tmp')[0];

反而。还要确保在获取图像尺寸时图像实际上是可见的，如果元素被隐藏clientWidth，clientHeight它将为零。

score 0 · Accepted Answer

我试过你的方法，它的工作。只是你写得不好。你忘了关闭报价。

var oImg = new Image();
oImg.src = 'uploads/obr1.jpg';
if (oImg.complete) {
  alert(oImg.width)
}

3 回答 3