How do I pass the values of a series of variables into a jQuery on() event as they are when the event is added?

Question

This is the full code of the function (the event_option function itself works fine, but it just isn't recieving the proper parameters):

function fire_event(event, scopes) {
    if (scopes[scopes.length-1] == data_player) {
        opts = ""
        i = 0;
        data_events[ event ].options.forEach(option => {
            opts += `<br><button id="event-${event}-option-${i}">${localisation[data_events[ event ].options[i].name]}</button>`
            i += 1;
        });
        eventhtml = `<div id="event-${event}" class="event">
            <h2>${localisation[ data_events[ event ].title ]}</h2>
            <p>${localisation[ data_events[ event ].desc ]}</p>
            ${opts}
        </div>`
        $("#events").html($("#events").html()+eventhtml);
        i = 0;
        data_events[ event ].options.forEach(option => {
            $(`#event-${event}-option-${i}`).click(function() { event_option(event, i, scopes) });
            i += 1;
        });
        $(`#event-${event}`).on('mousedown', handle_mousedown);
    }
}

This function, specifically the lines

data_events[ event ].options.forEach(option => {
            $(`#event-${event}-option-${i}`).click(function() { event_option(event, i, scopes) });
            i += 1;
        });

is meant to make it so that clicking on the button will fire event_option(event, i, scopes) where the three values are meant to be as they were when the click function was added. However, clicking the button makes it use the values of the variables as they are when the click occurs.

(I also apologise for using the word "event" for one of the parts of my code despite not meaning actual code events.)

Don't use an implicitly global variable like `i`. Declare local variables instead. — CertainPerformance, Nov 03 '22 at 22:53
@CertainPerformance Sorry but could you perhaps give an example of how to make it a local variable? — tombricks, Nov 03 '22 at 23:06
With the `let` keyword in front of it when you declare the variable — CertainPerformance, Nov 03 '22 at 23:07
@CertainPerformance Adding `let` in front of the declaration for `i` still results in the incorrect parameter, with `i` being `2` (The forEach goes twice so the final result of `i` would be `2`) — tombricks, Nov 03 '22 at 23:13
Then declare another variable inside the loop, and reference that variable instead of the outer one that changes — CertainPerformance, Nov 03 '22 at 23:22

How do I pass the values of a series of variables into a jQuery on() event as they are when the event is added?

0 Answers0