Невозможно сделать тот же эффект для пяти элементов холста

Question

Я следовал коду, который указан j08691 здесь для canvas.

Это сработало отлично, и я попробовал пять элементов canvas, но получаю ошибку в JavaScript, поскольку я новичок в JavaScript, пожалуйста, помогите мне.

Answer 1

Объяснения @Nickolay и @apsillers оба верны, но их код (ы) не работают, потому что они переопределяют аргумент i / ctxi, который никогда не присваивается. Вместо этого используйте следующее:

function getHandler(i) {
    return function() {
        ctx[i].drawImage(img[i], 0, 0);
    };
}
img[i].onload = getHandler(i);

Answer 2

ctx [i] и img [i] находятся вне области видимости в обработчике загрузки.

img [[i], однако, доступен через это, но вы должны передать ctx [i] в ​​качестве аргумента вашего обработчика загрузки

        img[i].onload = function(ctxi) {
            return function(ctxi) {
                ctxi.drawImage(this, 0, 0);
            }
        }(ctx[i]);