Значение функции в цикл JavaScript

Question

Всем привет, допустим есть несколько кнопок в HTML

<input type="button" class="b" value="a">
<input type="button" class="b" value="b">
<input type="button" class="b" value="c">
<input type="button" class="b" value="d">
<input type="button" class="b" value="e">

и есть функция которая должна брать значение этих кнопок

var x = document.getElementsByClassName ("b");
for (var i=0; i<x.length;i++){
    x[i].onclick = function show() {
        console.log(x[i].value)
}}

Но x[i] который в console.log находится вне цикла и принимает конечное значение i после завершение цикла, так вот вопрос в том, как ввести этот i внутрь цикла, чтобы значение функции соответствовало значению кнопки

Answer 1

Вместо

for (var i=0; ...

писать

for (let i=0; ...

Answer 2

Ответ

События в цикле имеют побочный эффект. При вызове события i уже ровно x.length и не важно, что цикл завершился. Решаем этот момент таким образом:

var x = document.getElementsByClassName("b");
for (var i = 0; i < x.length; i++) {
    let iCopy = i;
    x[iCopy].onclick = function show() {
        console.log(x[iCopy].value);
    };
}

БЛОГ НА HUSL

Значение функции в цикл JavaScript

Ответы (2 шт):

Ответ