Problema: tengo una página que tiene varios botones para guardar y aparecerá un mensaje de alerta si se presiona el botón. Tengo un botón guardar todo que usa nodeList para guardar todos los datos en función de si la casilla de verificación está marcada, lo que significa que si hay 10 casillas de verificación marcada, entonces la función saveall() ejecutará la función save() 10 veces y aparecerán 10 mensajes de alerta.

Lo que esperaba: Quiero ejecutar la función saveAll() y el mensaje de alerta solo debería aparecer una vez, así que espero que una función restrinja la alerta en la función save() para que se ejecute una sola vez, aunque se ejecutará 10 veces continuamente. Se agradece cualquier otra forma de obtener el resultado esperado.

Código de ejemplo:

 <table class="table" border="1"> <thead> <tr> <th>Input</th> <th><input id="1"></th> <th><input type="checkbox" class="box"></th> <th><button type="submit" onclick="save()">save</button></th> </tr> <tr> <th>Input</th> <th><input id="2"></th> <th><input type="checkbox" class="box"></th> <th><button onclick="save()">save</button></th> </tr> <tr> <th>Input</th> <th><input id="3"></th> <th><input type="checkbox" class="box"></th> <th><button onclick="save()">save</button></th> </tr> <button onclick="saveall()">save all</button> </thead> </table> function save(){ //save something into database alert("success"); } function saveall() { let nodeList = document.querySelectorAll('.box:checked'); nodeList.forEach(node => node.parentNode.parentNode.querySelectorAll('button')[0].click()); }