Аргумент функции внутри цикла - можно?
Здравствуйте!
Я не знаю как мне правильно сформулировать вопрос. У меня такой код:
let butShag = document.querySelectorAll('.butShag');
for (let i = 0; i < butShag.length; i++) {
butShag[i].addEventListener('click', function () {
title(i); //Вот здесь i можно передавать?
})
}
Можно ли так передавать индекс в title(i); ? При клике на первую кнопку срабатывает, а на остальных даёт ошибку. Или это недопустимо в JavaScript? |
let butShag = document.querySelectorAll('.butShag');
for (let i = 0; i < butShag.length; i++) {
butShag[i].addEventListener('click', function (i) {
title(i);
}.bind(butShag[i], i))
}
Но правильней будет вынести функцию обработчика, чтобы не создавать её каждый раз по новой. А ещё правильней будет не использовать цикл, а использовать метод массива forEach, тогда и проблема с индексом отпадёт.
let butShag = document.querySelectorAll('.butShag');
function onClick(index, event) {
title(index);
}
Array.prototype.forEach.call(butShag, (item, index) => item.addEventListener('click', onClick.bind(item, index));
|
MC-XOBAHCK,
Пример ошибочного использования |
возможно, стоит подумать о делегировании
|
Цитата:
[].forEach.call(document.querySelectorAll('.butShag'), function(node, index) {
node.addEventListener("click", function() {
title(index);
})
});
|
Спасибо всем за науку.
Для меня методы в предложенных решениях новЫ, я про них читал и видел, но никогда не использовал. Вот видимо пришло время и повод чтобы их осваивать. |
| Часовой пояс GMT +3, время: 20:49. |