jQuery error function inside of a for loop that loads an image array?

Question

I created several arrays like this:

var project1 = new Array();
var project2 = new Array();
var project3 = new Array();

i wrote a function with a for loop inside to load images to those arrays like so:

function loadProject(whichCount, whichProject, whichImages){
    for(let i = 1; i <= whichCount; i++){
        whichProject[i] = new Image();
        whichProject[i].src = whichImages + i + '.jpg';
    };
};

loadProject(max1, project1, 'content/images/archive/archive');
loadProject(max2, project2, 'content/images/celine/celine');
loadProject(max3, project3, 'content/images/chair/chair');

like this, this code works fine. Now I want to be flexible to use either jpgs and pngs. Unfortunately the way I tried to approach wouldn't work out. Maybe because that's not how I call the object?

function loadProject(whichCount, whichProject, whichImages){
    for(let i = 1; i <= whichCount; i++){
        whichProject[i] = new Image();
        whichProject[i].src = whichImages + i + '.jpg';
        whichProject[i].on('error', function() {
            whichProject[i].src = whichImages + i + '.png';
        });
    };
};

EDIT: I added let to i = 1

You're not really using any jQuery anywhere, until you try to assign the error event handler. You need `$(whichProject[i]).on(...)` instead. — , Mar 22 '21 at 11:06

jQuery error function inside of a for loop that loads an image array?

0 Answers0