Question

html5 怎么在canvas上 绘制多张图片

var width = document.body.clientWidth;
var height = document.body.scrollHeight;
var gameCanvas = document.getElementById("gameCanvas");
gameCanvas.height = height;
gameCanvas.width = width;
var ctx = gameCanvas.getContext("2d");
for (var i = 1; i <= totalHeadPics; i++) {
var randomWidth = 0;
while (randomWidth <= 0) {
randomWidth = parseInt(width * Math.random());
}
var randomHeight = 0;
while (randomHeight <= 0) {
randomHeight = parseInt(height * Math.random());
}
var img = new Image();
img.src = 'img/' + headPicMap[i - 1];
img.onload = function() {
ctx.drawImage(img, randomWidth, randomHeight, 50, 65);
ctx.save();
}
}

我这样绘制出来后，还是只有一张图！

• 你的回答被采纳后将获得：
• 系统奖励15（财富值+成长值）+难题奖励10（财富值+成长值）+提问者悬赏15（财富值+成长值）

若以下回答无法解决问题，邀请你更新回答

Answer 1

是不是一直只有最后一张图，这个有可能要使用闭包才可以实现 。