Для того чтобы понять, почему event listener работает только на последней кнопке, необходимо рассмотреть код, который использовался для назначения слушателя событий.
Вероятно, проблема заключается в использовании одинаковых имен или идентификаторов для всех кнопок, на которые вы хотите назначить слушатель событий.
Когда вы используете одно и то же имя или идентификатор для нескольких элементов, JavaScript будет считывать только последний элемент с этим именем или идентификатором. Когда вы пытаетесь назначить слушатель событий таким образом, то в результате он будет применен только к последнему элементу.
Например, предположим, у вас есть следующий код:
<button id="button">Кнопка 1</button> <button id="button">Кнопка 2</button> <button id="button">Кнопка 3</button>
В данном случае, вы назначили одинаковый идентификатор "button" для всех трех кнопок. Использование одинакового идентификатора приведет к тому, что JavaScript будет обращаться только к последнему элементу с этим идентификатором.
Чтобы исправить эту проблему, необходимо использовать уникальные идентификаторы для каждой кнопки. Например, вы можете изменить код следующим образом:
<button id="button1">Кнопка 1</button> <button id="button2">Кнопка 2</button> <button id="button3">Кнопка 3</button>
Теперь каждая кнопка имеет уникальный идентификатор. В JavaScript вы можете назначить слушателя событий каждой кнопке, используя соответствующие идентификаторы:
document.getElementById("button1").addEventListener("click", function() {
// обработчик события для кнопки 1
});
document.getElementById("button2").addEventListener("click", function() {
// обработчик события для кнопки 2
});
document.getElementById("button3").addEventListener("click", function() {
// обработчик события для кнопки 3
});
Теперь у каждой кнопки есть свой собственный слушатель событий, и они все будут работать корректно.
Надеюсь, что этот ответ помог вам понять, почему event listener работает только на последней кнопке и как это исправить. Если у вас остались вопросы, не стесняйтесь задавать их.