Soy muy nuevo en Javascript y quiero construir una máquina expendedora para mi primer proyecto. Tengo el problema de que quiero que si se paga la cantidad correcta, haya una alerta que diga 'Ha pagado su artículo', pero actualmente no funciona cuando la pantalla llega a 0. Creo que es porque la variable la cantidad no cambia y en su lugar solo muestra un número diferente. ¿Cómo hago para que realmente me avise cuando he insertado la cantidad correcta de monedas de 1 céntimo? Traté de buscar en Google mi problema, pero ni siquiera sé cómo describirlo exactamente.
var item1 = 100; var ct1 = 1; function showPrice1() { document.getElementById("display").innerHTML = item1; } function insert1cent() { document.getElementById("display").innerHTML = item1 -= ct1; } if (item1 == 0) { alert('You have paid for your item'); }y este es el HTML:
<body> <div id="display"> </div> <button id="button1" type="button" onclick="showPrice1()"> 1 </button> <button id="ct1" type="button" onclick="insert1cent()"> 1ct </button> </body>Gracias de antemano por su ayuda.
La declaración if debe estar dentro de su function para verificar cada clic y debe return false para evitar la disminución una vez que su contador llegue a 0 . Como se demuestra en el fiddle .
var item1 = 10; var ct1 = 1; function showPrice1() { document.getElementById("display").innerHTML = item1; } function insert1cent() { if (item1 == 0) { alert('You have paid for your item'); return false; } item1 -= ct1; document.getElementById("display").innerHTML = item1; } <div id="display"> </div> <button id="button1" type="button" onclick="showPrice1()"> 1 </button> <button id="ct1" type="button" onclick="insert1cent()"> 1ct </button>