Atividade proposta:
Faça uma página WEB que simule um sistema de caixa eletrônico:
- As notas disponíveis no terminal de caixa eletrônico são apenas notas de R$10, R$50 e R$100.
- O usuário deverá digitar o valor a ser sacado em seguida o programa deverá validar o saque, ou seja, se é possível efetuar o saque.
- No caso de um saque de R$ 160,00, deverá ser entregue ao cliente:
– 1 nota de R$ 100,00;
– 1 nota de R$ 50,00;
– 1 nota de R$ 10,00.Detalhes importantes:
- Na aba do navegador o título deve ser caixa eletrônico.
- O ícone (figura) deve estar alinhado à esquerda com tamanho de 200 px por 200 px.
- Na página deve existir um campo para o usuário digitar o valor do saque.
- No campo valor do saque deve ser digitados apenas números inteiros e maiores que zero, caso o usuário digite valores não numéricos a página deve advertir o usuário.
- Na página deve ter dois botões:
a) Um botão que faz o cálculo, cujo nome deve ser “Exibir notas para saque”
b) Um botão que limpa os dados da consulta antiga e habilita a página para uma nova consulta
HTML
<!DOCTYPE html>
<html lang="pt-br">
<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">
<link rel="stylesheet" href="css/estilos.css">
<title>Caixa Elêtronico</title>
</head>
<body>
<img src="img/caixa.jpg" alt="Caixa para Saque" class="img">
<h1>Programa Caixa Elêtronico</h1>
<p>
Valor de Saque:
<input type="text" id="InValorSaque">
</p>
<p>
<input type="button" value="Exibir Notas Para Saque" id="btSacados">
</p>
<p>
<input type="button" value="Limpar Consulta" id="btLimparConsulta">
</p>
<h3 id="outResposta"></h3>
<script src="script.js"></script>
</body>
</html>
Javascript
function calcularSaque() {
var inValorSaque = document.getElementById("inValorSaque");
var outCinquenta = document.getElementById("outCinquenta");
var outCem = document.getElementById("outCem");
var outDez = document.getElementById("outDez");
var valor = Number(inValorSaque.value);
var notaum = parseInt(valor)/100;
var notadois = parseInt((notaum*100)-valor)/50;
var notatres = parseInt((notaum*100)-valor);
var notaquatro = parseInt(notadois*50)-parseInt(notatres);
var notadez = parseInt(notaquatro)/10;
outCem.textContent = "Notas de R$ 100:" + notaum.toFixed(1);
outCinquenta.textContent = "Notas de R$ 50:" + notadois.toFixed(1);
outDez.textContent = "Notas de R$: 10" + notadez.toFixed(1);
}
var InValorSaque = document.getElementById("InValorSaque");
InValorSaque.addEventListener("click", calcularSaque);
function limparConsulta() {
location.reload();
document.getElementById("inValorSaque").focus();
}
var btLimparConsulta = document.getElementById("btLimparConsulta");
btLimparConsulta.addEventListener("click", limparConsulta);