JavaScript 将事件添加到相同类名的元素

JavaScript adding events to elements of same classname

本文关键字：同类 元素 事件 添加 JavaScript      更新时间：2023-09-26

我在收到 JSON 后生成一些元素。那些类名为"tipoGenero"的元素有一些CSS。我希望当单击这些元素中的任何一个时，显示<span>的值。但是，它可以工作并生成事件，但是无论我单击什么元素，我都只能获得最后一个元素的值。

for (var i = 0; i < parsedText.length; i++) {
    dato += "<div class='tipoGenero'>";
    dato += "<img src=/logos/" + parsedText[i].imagen + ">";
    dato += "<span>" + parsedText[i].nombre + "</span>";
    dato += "</div>";
} 
document.getElementById('generos').innerHTML = dato;
//generates events for class items 
var classname = document.getElementsByClassName("tipoGenero");
for (var i = 0; i < classname.length; i++) {
    valor = classname[i].children[1].textContent;
    alert(valor);
    classname[i].addEventListener('click', function() { myFunction(valor); }, false);
}
function myFunction(text) {
    alert(text);
}

您必须在侦听器中保存"valor"的当前值： 可以这样做：

classname[i].addEventListener('click', function(val){
    return function(){
        myFunction(val);
    };
})(valor), false);

相关文章：