| Calculadoras |
Estilos utilizados
.tecla {
width: 30px;
height: 30px;
text-align: center;
font-size: 12px;
font-weight: bold;
}
.display {
font-size: 14px;
font-weight: bold;
font-style: italic;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-align: right;
background-color: black;
color: lime;
width: 100%;
height: 22px;
border: 3px ridge blue;
}
Código JavaScript
var control = 0;
var operando1, operando2;
var operador;
var memoria = 0;
function redondeo(number, numDec)
{
var roundNum = number * (Math.pow(10, numDec));
roundNum = Math.round(roundNum);
var returnNum = roundNum / (Math.pow(10, numDec));
return returnNum;
}
function convertirMoneda(cambio)
{
var cantidad = document.forms["FCalculadora"].pantalla.value * cambio;
document.forms["FCalculadora"].pantalla.value = redondeo(cantidad, 3);
}
function insertaPunto()
{
var valor = eval("document.forms['FCalculadora'].pantalla.value");
if (control==0)
{
if(valor.indexOf('.') == -1)
eval("document.forms['FCalculadora'].pantalla.value = document.forms['FCalculadora'].pantalla.value + '.'");
}
else
{
document.forms["FCalculadora"].pantalla.value = "0.";
control=0;
}
document.forms["FCalculadora"].pantalla.focus();
}
function insertaNumero(num)
{
if(eval("document.forms['FCalculadora'].pantalla.value == '0'") || control == 1)
{
eval("document.forms['FCalculadora'].pantalla.value = num");
control = 0;
}
else
eval("document.forms['FCalculadora'].pantalla.value = document.forms['FCalculadora'].pantalla.value + num");
document.forms["FCalculadora"].pantalla.focus();
}
function borrar()
{
if (document.forms["FCalculadora"].pantalla.value == '0')
{
operando1=null;
operando2=null;
}
document.forms["FCalculadora"].pantalla.value = '0';
document.forms["FCalculadora"].pantalla.focus();
}
function operacion(op)
{
var aux = eval("document.forms['FCalculadora'].pantalla.value"); //Para acumular operaciones anteriores
if (operando1!=null)
{
resultado();
operando1=eval("document.forms['FCalculadora'].pantalla.value");
}
else
operando1 = aux;
operador = op;
control = 1;
document.forms["FCalculadora"].pantalla.focus();
}
function resultado()
{
operando2 = eval("document.forms['FCalculadora'].pantalla.value");
if(operando1 != "" && operando1 != null && operador != "" && operador != null &&
operando2 != "" && operando2 != null)
{
var total = eval("parseFloat(operando1)" + operador + "parseFloat(operando2)");
if(isNaN(total))
eval("document.forms['FCalculadora'].pantalla.value = 'Error'");
else
eval("document.forms['FCalculadora'].pantalla.value = total");
control = 1;
}
operando1=null;
operando2=null;
document.forms["FCalculadora"].pantalla.focus();
}
function porcentaje()
{
operando2 = eval("document.forms['FCalculadora'].pantalla.value");
eval("document.forms['FCalculadora'].pantalla.value = (operando1 * operando2) / 100");
control = 1;
document.forms["FCalculadora"].pantalla.focus();
}
function guardarMemoria(signo)
{
var valor = eval("document.forms['FCalculadora'].pantalla.value");
if(signo == '-')
memoria = parseFloat(memoria) - parseFloat(valor);
else
memoria = parseFloat(memoria) + parseFloat(valor);
document.forms["FCalculadora"].pantalla.focus();
}
function recuperarMemoria()
{
eval("document.forms['FCalculadora'].pantalla.value = memoria");
document.forms["FCalculadora"].pantalla.focus();
}
function borrarMemoria()
{
memoria = 0;
document.forms["FCalculadora"].pantalla.focus();
}
function cambiaSigno()
{
var valor = eval("document.forms['FCalculadora'].pantalla.value");
if(valor.indexOf('-') == 0)
valor = valor.substring(1);
else
valor = '-' + valor;
eval("document.forms['FCalculadora'].pantalla.value = valor");
document.forms["FCalculadora"].pantalla.focus();
}
function recogerTecla(evt)
{
var keyCode = document.layers ? evt.which : document.all ? evt.keyCode : evt.keyCode;
var keyChar = String.fromCharCode(keyCode);
if(keyCode==13) //Si se pulsa enter da directamente el resultado
resultado();
else{//Si se pulsa una tecla distinta de enter
switch (keyCode)
{
case 96:{
keyChar="0";break;}
case 97:{
keyChar="1";break;}
case 98:{
keyChar="2";break;}
case 99:{
keyChar="3";break;}
case 100:{
keyChar="4";break;}
case 101:{
keyChar="5";break;}
case 102:{
keyChar="6";break;}
case 103:{
keyChar="7";break;}
case 104:{
keyChar="8";break;}
case 105:{
keyChar="9";break;}
case 106:{ //si se pulsa la tecla x del teclado numerico
operacion('*');break;}
case 107:{ //si se pulsa la tecla + del teclado numerico
operacion('+');break;}
case 109:{ //si se pulsa la tecla - del teclado numerico
operacion('-');break;}
case 111:{ //si se pulsa la tecla / del teclado numerico
operacion('/');break;}
case 188: //Si se pulsa coma o punto inserta un punto y convierte la cantidad
case 190:
case 110: {
insertaPunto();break;}
case 8: //si se pulsa la tecla borrar (backspace) borrar el ultimo digito
document.forms["FCalculadora"].pantalla.value=document.forms["FCalculadora"].pantalla.value.substr(0,document.forms["FCalculadora"].pantalla.value.length-1);
break;
case 27: //Tecla Esc
case 67:{
borrar();break;}
case 76:{
Funcion('log');break;}
case 83:{
Funcion('sin');break;}
case 84:{
Funcion('tag');break;}
case 88:{
invertir();break;}
}
for (i = 0; i<10 ; i++) //Para el teclado numerico
{
if (keyChar==i){
if (document.forms["FCalculadora"].pantalla.value =="0" || control==1)
{
document.forms["FCalculadora"].pantalla.value = i;
control=0;
}
else
document.forms["FCalculadora"].pantalla.value = document.forms["FCalculadora"].pantalla.value + i;
}
}// fin del for
}
document.forms["FCalculadora"].pantalla.focus();
}
function invertir()
{
var valor = eval("document.forms['FCalculadora'].pantalla.value");
valor=1/parseFloat(valor)
eval("document.forms['FCalculadora'].pantalla.value = valor");
document.forms["FCalculadora"].pantalla.focus();
control = 1;
}
function Funcion(nombre)
{
var valor = eval("document.forms['FCalculadora'].pantalla.value");
valor = eval("Math." + nombre + "(document.forms['FCalculadora'].pantalla.value)");
eval("document.forms['FCalculadora'].pantalla.value = valor");
document.forms["FCalculadora"].pantalla.focus();
control = 1;
}
Código HTML
<body onload="document.forms['FCalculadora'].pantalla.value='0';document.forms['FCalculadora'].pantalla.focus();">
....
<form name="FCalculadora" action="javascript:resultado();">
<table border="1" cellpadding="0" cellspacing="0">
<tr><td colspan="6" align="center">
<input type="text" class="display" name="pantalla" value="0" align="middle" onKeyDown = "javascript:recogerTecla(event)" readonly>
</td></tr>
<tr>
<td colspan=3><input type="button" value="€->Ptas" style="width: 100%;" onclick="convertirMoneda(166.386);" class="tecla" /></td>
<td colspan=3><input type="button" value="Ptas->€" style="width: 100%;" onclick="convertirMoneda(1/166.386);" class="tecla" /></td>
</tr>
<tr>
<td><input type="button" value="1/x" onclick="invertir();" class="tecla" /></td>
<td><input type="button" value="Ln" onclick="Funcion('log');" class="tecla" /></td>
<td><input type="button" value="sin" onclick="Funcion('sin');" class="tecla" /></td>
<td><input type="button" value="cos" onclick="Funcion('cos')" class="tecla" /></td>
<td><input type="button" value="tag" onclick="Funcion('tan');" class="tecla" /></td>
<td><input type="button" value="C" onclick="borrar();" class="tecla" /></td>
</tr>
<tr>
<td><input type="button" value="MC" onclick="borrarMemoria();" class="tecla" /></td>
<td><input type="button" value="7" onclick="insertaNumero('7');" class="tecla" /></td>
<td><input type="button" value="8" onclick="insertaNumero('8');" class="tecla" /></td>
<td><input type="button" value="9" onclick="insertaNumero('9');" class="tecla" /></td>
<td><input type="button" value="/" onclick="operacion('/')" class="tecla" /></td>
<td><input type="button" value="Sqrt" onclick="Funcion('sqrt');" class="tecla" /></td>
</tr>
<tr>
<td><input type="button" value="MR" onclick="recuperarMemoria();" class="tecla" /></td>
<td><input type="button" value="4" onclick="insertaNumero('4');" class="tecla" /></td>
<td><input type="button" value="5" onclick="insertaNumero('5');" class="tecla" /></td>
<td><input type="button" value="6" onclick="insertaNumero('6');" class="tecla" /></td>
<td><input type="button" value="*" onclick="operacion('*');" class="tecla" /></td>
<td><input type="button" value="%" onclick="porcentaje();" class="tecla" /></td>
</tr>
<tr>
<td><input type="button" value="M-" onclick="guardarMemoria('-');" class="tecla" /></td>
<td><input type="button" value="1" onclick="insertaNumero('1');" class="tecla" /></td>
<td><input type="button" value="2" onclick="insertaNumero('2');" class="tecla" /></td>
<td><input type="button" value="3" onclick="insertaNumero('3');" class="tecla" /></td>
<td><input type="button" value="-" onclick="operacion('-');" class="tecla" /></td>
<td rowspan="2"><input type="button" value="=" onclick="resultado();" class="tecla" style="height: 62px;"/></td>
</tr>
<tr>
<td><input type="button" value="M+" onclick="guardarMemoria('+');" class="tecla" /></td>
<td><input type="button" value="0" onclick="insertaNumero('0');" class="tecla" /></td>
<td><input type="button" value="," onclick="insertaPunto();" class="tecla" /></td>
<td><input type="button" value="-/+" onclick="cambiaSigno();" class="tecla" /></td>
<td><input type="button" value="+" onclick="operacion('+')" class="tecla" /></td>
</tr>
</table>
</form>