Skip to content

D
dia004
Commit 9c5a2d1d by Joel Florentin
Options

calculadora keydown

parent 2c607208
Showing with 30 additions and 8 deletions
calculadora.html
...@@ -3,14 +3,14 @@ ...@@ -3,14 +3,14 @@
<head> <head>
<meta charset='utf-8'> <meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'> <meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>Page Title</title> <title>Calculadora</title>
<meta name='viewport' content='width=device-width, initial-scale=1'> <meta name='viewport' content='width=device-width, initial-scale=1'>
<link rel='stylesheet' type='text/css' media='screen' href='main.css'> <link rel='stylesheet' type='text/css' media='screen' href='main.css'>
</head> </head>
<body> <body>
<p id="screen-anterior"></p> <p id="screen-anterior"></p>
<input type="text" id="screen"> <input type="text" id="screen" disabled>
<table> <table>
<tr> <tr>
<td class="tecla">7</td> <td class="tecla">8</td> <td class="tecla">9</td> <td class="tecla">+</td> <td class="tecla">7</td> <td class="tecla">8</td> <td class="tecla">9</td> <td class="tecla">+</td>
......
main.css 0 → 100644
#screen-anterior,#screen{
width: 11em;
height: 2em;
margin-left: 30%;
text-align: right;
}
.tecla{
border: 2px solid;
padding: 3px;
height: 2em;
width: 2em;
padding:0px;
text-align: center;
}
table{
margin-left: 30%;
}
\ No newline at end of file
main.js
const teclas = document.querySelectorAll('.tecla'); const teclas = document.querySelectorAll('.tecla');
var screen = document.getElementById("screen"); var screen = document.getElementById("screen");
var screenAnterior = document.getElementById("screen-anterior"); var screenAnterior = document.getElementById("screen-anterior");
var entrada_anterior; var entrada_anterior="";
var dot_posible = true; var dot_posible = true;
var escribir = function(event) {
let contenido = event.target.innerHTML; var escribir = function(contenido) {
switch (getTipo(contenido)) { switch (getTipo(contenido)) {
case "num": case "num":
switch (getTipo(entrada_anterior)) { switch (getTipo(entrada_anterior)) {
case "num": case "num": case "":
screen.value = Number(screen.value + contenido) screen.value = Number(screen.value + contenido)
break; break;
case "op": case "op":
...@@ -102,6 +102,7 @@ function getTipo(valor){ ...@@ -102,6 +102,7 @@ function getTipo(valor){
if(esOperador(valor)) return "op"; if(esOperador(valor)) return "op";
if(valor=="=") return "eq"; if(valor=="=") return "eq";
if(valor==".") return "dot"; if(valor==".") return "dot";
return valor;
} }
function operar(a,b,op){ function operar(a,b,op){
...@@ -121,4 +122,5 @@ function operar(a,b,op){ ...@@ -121,4 +122,5 @@ function operar(a,b,op){
} }
} }
teclas.forEach(el => el.addEventListener('click', escribir)); teclas.forEach(el => el.addEventListener('click', event =>{escribir(event.target.innerHTML)}));
\ No newline at end of file document.addEventListener('keypress',event => {escribir(event.key)})
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment