JavaScript游戏类型不匹配错误

我正在用HTML/JavaScript制作一个游戏。 游戏将会像MineCraft一样，但是是2D。 不起作用的代码用于渲染块。 所有变量都已设置，但在我给您的代码中没有显示。 这段代码是有效的，但现在不行了

for(var key in blocks){
    context.drawImage(blocks[key].img, blocks[key].x, blocks[key].y, size, size);
    if(collision(blocks[key], player)) context.fillText("COLLISION", 200, 20);
}

---

类型不匹配错误位于

上下文.drawImage（块[key].img，块[key].x，块[key].y，大小，大小）中
当传递给
上下文的第一个参数不正确时，可能会出现此错误。drawImage
方法不正确。只有图像对象、画布或视频元素可以作为第一个参数传递

在使用drawImage将图像绘制到画布上之前，请确保已加载图像。在下面的示例中，请注意img.grass.onload方法。它可确保图像资源可用于绘制：

var img = {};
img.grass = new Image();
img.grass.src = "grass.jpg";
img.grass.onload = function() {
  for (i = 0; i < 10; i++){
    for (j = 0; j < 10; j++){
      context.drawImage(img.grass, j*50, i*50, 50, 50);
    }
  }
}

var-img={}；
img.grass=新图像（）；
img.grass.src=“grass.jpg”；
img.grass.onload=函数（）{
对于（i=0；i<10；i++）{
对于（j=0；j<10；j++）{
背景.绘图图像（img.grass，j*50，i*50，50，50）；
}
}
}
谢谢，但它是一个图像对象。以下是制作图像的代码。img.grass=新图像（）；img.grass.src=“img/grass.png”；block=img.grass；var asd={x:Math.round（player.x/size）*size，y:Math.round（player.y/size）*size-10，img:block，id:Math.random（）*100}；块[asd.id]=asd；希望它有助于在编辑后的答案中选中
onload
方法。谢谢，但我还有其他图像，如灰尘、石头、木板等。首先要做的事情之一是加载图像，它适用于使用相同图像的其他事物，但它没有此错误。是否显示了另一个js错误？能否检查循环中块[key].img返回的值（使用console.log）？在使用drawImage之前是否检查了图像是否已加载？如果草图像比其他图像大，这可能解释了为什么只有此图像才会出现此错误。浏览器没有足够的时间加载草地图像，而其他图像在脚本执行期间的正确时间加载。