He declarado la siguiente función que agrega un evento click a cada una de las celdas de una tabla HTML
// variables globales
let data = [];
let c_key;
// función activada por el botón -recoger índice-
function cellSelector() {
table.style.background = '#6165702c';
// elimina todos los valores la siguiente vez que se llame a la funcion
data.splice(0);
let td = table.querySelectorAll('td');
c_key = true;
td.forEach(c => {
c.classList.add('td-hover');
c.addEventListener('click', () => {
// varible bandera que activara o desactivara el evento onclik
if (c_key) {
// empujando índice cada vez que se realiza un click
data.push(c.cellIndex);
c.classList.add('td-selected');
}
});
});
td_action_flag = true;
btn_done.disabled = false;
}
el objetivo es recolectar el índice de la celda a la que se le ha hecho click para realizar operaciones diversas a través de la manipulación del DOM. ej: guardar texto de la celda.
recoge correctamente los índices de las celdas y los gurda en un array (data), el problema reside cuando el botón que activa la función es nuevamente presionado este realiza la captura de los índices pero a la vez duplica los valores
aclaración:
se presiona el botón recoger índice por primera vez, luego se hace click sobre las celdas deseadas - guarda en el array data[index_1, index_2] (muestra por consola). Operación Completada.
Se presiona el botón recoger índice nuevamente, guarda en el array data[index_1, index_1, index_2, index_2] duplicando los datos por cada llamada a la función
Espero me haya explicado bien. Gracias.