Показать сообщение отдельно
  #3 (permalink)  
Старый 05.11.2016, 20:05
Аспирант
Отправить личное сообщение для fuckingquest Посмотреть профиль Найти все сообщения от fuckingquest
 
Регистрация: 28.10.2016
Сообщений: 70

Koyf,
Выше правильный вариант подсказали, но вообще ваша проблема в том, что при создании всех коллбеков на onclick они замкнуты на одно и то же окружение(в данном случае -- глобальный объект), соответственно i в них всех вычисляется в последнее значение, вернувшееся из цикла.
вот наглядный пример:
arrayOfFunctions = []
i = 10
while(i--) arrayOfFunctions.push(function(){console.log(i)})
i = "foo"
arrayOfFunctions.forEach(function(f){f()})



//>>>> foo
//>>>> foo
//>>>> foo
//>>>> foo
//>>>> foo
//>>>> foo
//>>>> foo
//>>>> foo
//>>>> foo
//>>>> foo

Не всегда очевидное для новичков поведение.
Просто имейте это в виду.

UPD а добится желаемого эффекта довольно легко: просто компилировать ф-ции на лету:
arr = ["a", "b", "c"]
functions = []

i = -1
while(i < 2){ ++i; functions.push(Function("f", "console.log(arr[" + i + "])")) }
i = -1
while(i < 2){ ++i; functions.push(function(f){console.log(arr[i])}) }

functions.forEach(function(f){f()})


//>>>> a
//>>>> b
//>>>> c
//>>>> c
//>>>> c
//>>>> c

можно еще создавать дополнительные замыкания на каждой итерации или в ES6 можете еще воспользоваться декларацией переменных с блочной видимостью, но злоупотреблять этим не следует, так как это серьезный жер памяти.

Последний раз редактировалось fuckingquest, 05.11.2016 в 20:29.
Ответить с цитированием