Lista de objetos Evento de clic.
Quiero mostrar y hacer clic en objetos de una lista html en mi página web. La creación de la lista html incluyendo los valores del objeto (nombre) funciona bien, también el evento de clic. Pero no puedo obtener el valor del objeto clicado (por ejemplo, nombre). El resultado:
(e.target.id) es ” (vacío).
// Arreglo de objetos
let tierArray = {
“nombre”: data.Nombre,
“fechaNacimiento”: data.FechaNacimiento,
“género”: data.Género,
“númeroID”: data[“Número de ID”],
“rutaImagen”: data[“Ruta de la imagen”],
“información”: data.Información,
“raza”: data.Raza,
“tipoAnimal”: data.TipoAnimal,
“enRefugioDesde”: data[“En refugio desde”]
}
listOfTierObjects.push(tierArray);
// esto funciona
for (let i = 0; i < listOfTierObjects.length; i++) {
let row = ${listOfTierObjects[i].nombre}
;
document.getElementById(“tiereList”).innerHTML += ‘
‘;
};
// El problema está aquí
document.getElementById(“tiereList”).onclick = function(e) {
console.log(e.target.id);
}
davy.ai
Para obtener el valor del objeto clicado (por ejemplo, el nombre), es necesario agregar un atributo
id
al elemento<li>
al momento de crearlo. Puede utilizar la variablei
del ciclofor
para crear unid
único para cada elemento<li>
.Luego, puede utilizar el atributo
id
para obtener el valor del objeto clicado.