在您阅读本文之前,我的第一个帐户因我提出了不好的问题而被屏蔽。所以请不要投票反对,但请说出我做错了什么
所以我有这个脚本:
var img1 = new Image()
img1.src="image1.jpg"
var img2 = new Image()
img2.src="image2.jpg"
var img3 = new Image()
img3.src="image3.jpg"
function Canvas() {
var ctx = document.getElementById('slider').getContext('2d');
var pic=1
function slider() {
this.draw = function() {
if(pic<4){pic++}
else{
pic=1
}
var img = "img"+pic
ctx.drawImage(img,0,0,ctx.canvas.width,ctx.canvas.height)
}
}
var slider = new slider();
function draw() {
ctx.clearRect(0,0,ctx.canvas.width,ctx.canvas.height);
ctx.save();
//draw
slider.draw();
//draw
ctx.restore();
}
var animateInterval = setInterval(draw,100)
}
window.addEventListener('load', function(event) {
Canvas();
});
我正在尝试在 Canvas 上绘制图像 1 或 2 或 3。但我还有带有号码的 var pic。所以我尝试了 ctx.drawimage(img+pic,0,0)
或 var img = "img"+pic
然后绘制它。但这对我不起作用。
我希望您接受我的问题并能够回答它,THNX
最佳答案
使用数组代替
var img = [];
/* you should use a for loop here */
for (var i = 0; i < 3; i++) {
img[i] = new Image();
img[i].src = "image" + (i+1) ".jpg";
}
稍后您可以使用 img[pic]
引用正确的图像。请务必使用 0
和 img.length - 1
关于javascript - 如何创建两个变量的变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27621844/