Interactive map with buttons in the shape of states, each button has the state abbreviation as an id, when a button/state is clicked I would like to fire the function \"stat
Because when the handler runs, it looks up the value of i
, which is wherever it was after the loop finished.
You need to scope the i
variable in a function:
function listenerForI( i ) {
document.getElementById(stateList[i]).addEventListener('mousedown', function() {stateSelect(stateList[i])}, false);
}
for (var i = 0; i < stateList.length; i++) {
listenerForI( i );
}
Now the i
referenced by the handler will be the parameter to the listenerForI
function that was invoked. As such, that i
will reference the value that was passed in from the for
loop.