Created
October 2, 2021 15:58
-
-
Save jpacora/372d2c88dde490299d290812d5140f69 to your computer and use it in GitHub Desktop.
Cajero en HTML +JavaScript
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="es"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>ATM</title> | |
<script> | |
var balanceTotal = 666 | |
var operacionActual = null | |
</script> | |
</head> | |
<body> | |
<h1 id="balance"></h1> | |
<h2 id="operacion"></h2> | |
<div> | |
<button onclick="elegirOperacion('retiro')">Retirar</button> | |
<button onclick="elegirOperacion('deposito')">Depositar</button> | |
</div> | |
<div style="margin-top: 1em;"> | |
<button onclick="operar(10)">S/10</button> | |
<button onclick="operar(20)">S/20</button> | |
<button onclick="operar(30)">s/30</button> | |
</div> | |
<script> | |
const balance = document.getElementById("balance") | |
const operacion = document.getElementById("operacion") | |
const mostrarBalance = () => { | |
balance.innerHTML = `Balance: S/${balanceTotal}` | |
} | |
const mostrarOperacion = () => { | |
if(operacionActual === null) { | |
operacion.innerHTML = "Seleccione una operacion" | |
} else { | |
operacion.innerHTML = `Operacion actual: ${operacionActual}` | |
} | |
} | |
const elegirOperacion = tipo => { | |
operacionActual = tipo | |
mostrarOperacion() | |
} | |
const operar = monto => { | |
if(operacionActual === null) { | |
return alert("Primero debes elegir una operacion") | |
} | |
if(operacionActual === "deposito") { | |
balanceTotal = balanceTotal + monto | |
} else { | |
// es un retiro | |
let total = balanceTotal - monto | |
// verificamos si tiene el saldo suficiente | |
if(total < 0) { | |
return alert("Saldo insuficiente") | |
} else { | |
balanceTotal = total | |
} | |
} | |
mostrarBalance() | |
} | |
mostrarBalance() | |
mostrarOperacion() | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment