如何使用 jQuery 获取 DIV 背景图像的尺寸？

使用 jQuery 获取 DIV 背景图像的尺寸

在 jQuery 中寻求确定 DIV 背景图像的尺寸可以是挑战，尤其是当内置方法似乎达不到要求时。幸运的是，有一个解决方案可以利用 Image 对象的力量来克服这个障碍。

最初，人们认为简单的行“jQuery('#myDiv').css('background-image') 。高度（）;”足以检索背景图像的高度。然而，这种方法遇到了错误，表明结果不是函数。

成功的关键在于认识到背景图像存储为 URL 而不是实际图像。要访问维度，我们需要首先提取 URL。这可以使用以下代码来完成：

var image_url = jQuery('#myDiv').css('background-image').match(/^url\("?(.+?)"?\)$/);

获取 URL 后，我们创建一个 Image 对象并加载图像。加载后，对象将公开所需的尺寸：

if (image_url[1]) {
  image_url = image_url[1];
  var image = new Image();

  $(image).load(function() {
    alert(image.width + 'x' + image.height);
  });

  image.src = image_url;
}

此方法可确保加载实际图像并准确获取尺寸。此外，它支持各种形式的 URL 指定，包括带引号或括号的 URL 指定。

以上是如何使用 jQuery 获取 DIV 背景图像的尺寸？的详细内容。更多信息请关注PHP中文网其他相关文章！