Question

修改
我建议 markE 解决了我的问题。当然需要在加载后引用图像。通过使用＆＃39; .onload＆＃39; 功能，我获得了这个功能。然后，为了引用图像，我只需输入＆＃39; this.width＆＃39; ，因为我处于图像范围内。

END OF EDIT

我的画布对象必须绘制各种图像。这些图像基本上是物体的视觉效果。当试图获得图像的宽度时，我留下了一个糟糕的零：

this.image = new Image();
// src is a parameter to the constructor which this code is run in.
this.image.src = src;
console.log(this.image.width);

正如我所解释的，这段代码返回零。

到目前为止，我知道返回的宽度是基于图像的初始构造函数 - 在这种情况下，＆＃39; new Image（）;＆＃39; part。因此，如果没有插入任何参数，则计为零。

但是，如果我把例如：

this.image = new Image(2, 2);

.. ＆＃39; this.image.width＆＃39; 的返回值为2。

我的问题是：在加载图片前如何在不知情的情况下参考宽度？

Answer 1

您的图片大小在完全加载之前是未知的，因为它是异步加载的，因此在.src

之后不会立即知道大小。

设置.onload回调并在回调中放置任何需要宽度，高度的代码：

// new-up an image
this.image = new Image();

// set the callback for when the image is fully loaded
this.image.onload=function(){

    // the image is loaded and it's actual size is now known
    console.log(this.width);

}

// src is a parameter to the constructor which this code is run in.
this.image.src = src;

HTML5＆amp; JS：获得图像宽度

1 个答案: