我有使用javascript循环迭代的HTML元素
HTML看起来像这样
<div class="description">Item 1</div>
<div class="description">Item 2</div>
<div class="description">Item 2</div>
Javascript
let allItems = document.querySelectorAll(".description")
for (let i = 0; i <= allItems.length; i++) {
allItems[i].addEventListener("click", toggleSpinner.bind(this));
}
toggleSpinner = () => {
alert("I clicked") // here should be, for example, "I clicked Item 1,
// Or Item 2 or Item 3 depending on which was clicked
},
单击每个元素时如何独立调用函数
您可以使用类似的内容吗?
toggleSpinner = (data) => {
console.log(`You clicked item ${data}`) // here should be, for example, "I clicked Item 1,
// Or Item 2 or Item 3 depending on which was clicked
}
let allItems = document.querySelectorAll(".description")
for (let i = 0; i < allItems.length; i++) {
allItems[i].addEventListener("click", toggleSpinner.bind(this, allItems[i].dataset.item));
}
<div class="description" data-item="1">Item 1</div>
<div class="description" data-item="2">Item 2</div>
<div class="description" data-item="3">Item 3</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句