Soy un programador novato de JS que da sus primeros pasos en la programación, por lo que agradezco su ayuda para ayudarme a aprenderlo.
He creado una función que suma 5 a un valor ingresado por el usuario en INPUT. El resultado se muestra en . Funciona perfectamente. Después de hacer clic en el botón, aparece el resultado. Sin embargo, quiero usar el mismo botón para seguir agregando otros 5 al valor de salida sin ingresar un nuevo valor en la ENTRADA.
Intenté: -declarar el valor indefinido (let sum;) fuera de la función para hacer que la variable sea global, pero no funcionó.
Estaba pensando en:
let sum; let sum2; function adder5() { let userNumber = Number(document.querySelector("#yourNumber").value); sum = userNumber + 5; document.querySelector("#output").textContent = sum; } document.querySelector("#btn").addEventListener("click", adder5); function adderContinue(sum) { document.querySelector("#btn").addEventListener("click", function () { sum2 = sum + 5; }); document.querySelector("#output").textContent = sum2; } <input id="yourNumber" type="number" /> <button id="btn">Calculate</button> <p id="output"></p>Aprecio tu ayuda. Cualquier pista servirá porque estoy atascado. Por cierto, me doy cuenta de que la variable SUM cambia a SUM2 después del primer evento de clic, pero el código debería funcionar al menos una vez.
Puede usar el evento del campo de entrada para actualizar el valor almacenado en caché y actualizarlo al hacer clic en el botón.
const input = document.getElementById('input'), button = document.getElementById('button'), output = document.getElementById('output'); let value = input.valueAsNumber; input.oninput = function () { value = this.valueAsNumber; }; button.onclick = function () { value += 5; output.textContent = isNaN(value) ? '' : value; }; <input type="number" id="input" /> <button id="button">Calculate</button> <p id="output"></p> let sum = 0; let oldUserInput = 0; function adder5() { let currentUserInput = Number(document.querySelector("#yourNumber").value); if(currentUserInput === oldUserInput){ sum = sum + 5; } else { sum = currentUserInput + 5; // Update the oldUserInput to the current oldUserInput = currentUserInput; } document.querySelector("#output").textContent = sum; } document.querySelector("#btn").addEventListener("click", adder5);