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>