使用jquery获取没有指定宽度的图像宽度答案

【问题标题】：Getting the width of an image without an assigned width using jquery使用jquery获取没有指定宽度的图像宽度
【发布时间】：2011-08-31 19:24:38
【问题描述】：

我有以下代码，当单击缩略图时，它需要获取动态加载的图像的宽度。

$("<img class='mypopupimage' src='" + imgSrc + "' style='padding:10px;' width='500' />").appendTo("div.mydiv");

var imgWidth = $(".mypopupimage").width();

我遇到的问题是弹出图像都是不同的宽度，但是当我从图像中删除宽度属性时，imgWidth 变量被设置为 0。

有什么想法吗？

【问题讨论】：

this 的复制品：试试 $(".mypopupimage").attr("naturalWidth");
太棒了，谢谢...如果您将此作为答案添加，我可以接受它作为正确答案...
How to get image size (height & width) using javascript?的可能重复
Tom 只是在副本中对接受的答案进行投票，如果它对您也有帮助的话。

标签： javascript jquery width

【解决方案1】：

这已经在堆栈上多次回答了，但是，为了方便起见：

clientWidth 和 clientHeight 是 DOM 属性，显示 DOM 元素内部尺寸（不包括边距和边框）的当前浏览器内大小。因此，对于 IMG 元素，这将获得可见图像的实际尺寸。

var img = document.getElementById('imageid'); 
//or however you get a handle to the IMG
var width = img.clientWidth;
var height = img.clientHeight;

此答案取自here

【讨论】：

【解决方案2】：

如果您想使用 jQuery 或使用 udjamaflip 所述的“普通”javascript，您应该使用属性 naturalWidth：

$("<img class='mypopupimage' src='" + imgSrc + "' style='padding:10px;' width='500' />").appendTo("div.mydiv");
var imgWidth = $(".mypopupimage").attr('naturalWidth');

【讨论】：