Question

我想知道在加载之前是否可以获得图像的尺寸（宽度和高度）？不幸的是我不能使用像这样的代码：

$('img').load(function() {
    alert(this.width + ' ' + this.height);
});

我迫不及待地想要加载图片，我需要知道图片的大小。

是否可以或应该使用PHP和getimagesize（）函数并将其传递给HTML？

Answer 1

你做不到。浏览器在加载之前不会报告图像的尺寸。您必须获取服务器端的信息，或者更改您的方法，以便在加载之前不需要知道。

如果您只需要在将图像放入页面之前知道图像的大小（而不是在加载之前的字面上），您可以这样做：

img = new Image();
img.onload = function() {
  // Here, you can reliably use `width` and `height`
  display("Loaded, size is " + this.width + "x" + this.height);
};
img.src = "the/path/to/the/image/goes/here";

Live example

在设置load之前挂钩src事件非常重要，以防图片在缓存中并且事件立即触发。

（我不主张使用像onload这样的DOM0样式处理程序，但它们在快速示例中很有用。）

Answer 2

我想不出任何真正的理由，为什么你不能加载你的图像，然后放在文件中找出高度。您可以等待，直到图片加载完毕。如果你不能那么你完全设计你的应用程序是错误的。（以非判断的方式:)）

如何在加载之前获取JavaScript的图像宽度和高度？

2 个答案: