Question

我有一个函数imageReader(image)，它在加载后处理图像（这里是id =“bgImage”）。通过写imageReader(this)，我可以将图像本身作为变量，这样我就可以得到它的宽度，绘制它等等。

问题是我希望能够在我想要的时候定位页面中的任何图像（并且不依赖onload="javascript:imageReader(this)")，但$('bgImage').load(function(){});不会让我在那里。我如何定位任何图像作为我的功能变量？非常感谢！

<body>
    <canvas id="bg" width="0" height="0"></canvas>
    <img id="bgImage" src="img/logo.png" onload="javascript:imageReader(this);"></img>
</body>

我用以下功能做的一些事情

   function imageReader(image) {
      var imgWidth=image.width;
      var imgHeight=image.height;
      myCanvasContext.drawImage(image,0,0);
   }

Answer 1

实际上，我没有得到100％的问题我认为在图像加载后你很难获得Image对象吗？
你可以通过使用javascript
检查图像complete元素来做到这一点首先，声明一个JS函数来检测已经加载的图像：
var complete_load = function () {}
然后在函数内获取元素：
var the_img = document.getElementsById("bgImage");
然后，检查它是否完整参数，如果尚未加载，则使用setInterval重新循环：

if(the_img.complete){
   setInterval(complete_load , 200);
}

怎么样？

将图像作为变量传递（javascript，canvas）

1 个答案: