Resulta que quiero intentar hacer que se borre el ultimo numero que eh escrito pero no se me ocurre como. Algo haci como el backspace que tienen los ordenadores, por eso la flecha entre AC y el porcentage.
var primern;
var segundon;
var resultado2;
function init(){
//tuve que cambiar la forma de declarar las variables porque buscando lei que
//el getElementsClassName es para grupo de vaiables y yo solo tenia una y lo cambie por Id
var pantalla = document.getElementById('pantalla');
var reset = document.getElementById('reset');
var backspace = document.getElementById('backspace');
var porcentaje = document.getElementById('porcentaje');
var divicion = document.getElementById('divicion');
var multiplicacion = document.getElementById('multiplicacion');
var resta = document.getElementById('resta');
var suma = document.getElementById('suma');
var igual = document.getElementById('igual');
var numero1 = document.getElementById('numero1');
var numero2 = document.getElementById('numero2');
var numero3 = document.getElementById('numero3');
var numero4 = document.getElementById('numero4');
var numero5 = document.getElementById('numero5');
var numero6 = document.getElementById('numero6');
var numero7 = document.getElementById('numero7');
var numero8 = document.getElementById('numero8');
var numero9 = document.getElementById('numero9');
var cero = document.getElementById('cero');
var decimal = document.getElementById('decimal');
numero1.onclick = function(e){
pantalla.value = pantalla.value + "1";
}
numero2.onclick = function(e){
pantalla.value = pantalla.value + "2";
}
numero3.onclick = function(e){
pantalla.value = pantalla.value + "3";
}
numero4.onclick = function(e){
pantalla.value = pantalla.value + "4";
}
numero5.onclick = function(e){
pantalla.value = pantalla.value + "5";
}
numero6.onclick = function(e){
pantalla.value = pantalla.value + "6";
}
numero7.onclick = function(e){
pantalla.value = pantalla.value + "7";
}
numero8.onclick = function(e){
pantalla.value = pantalla.value + "8";
}
numero9.onclick = function(e){
pantalla.value = pantalla.value + "9";
}
cero.onclick = function(e){
pantalla.value = pantalla.value + "0";
}
decimal.onclick = function(e){
pantalla.value = pantalla.value + ".";
}
reset.onclick = function(e){
recetear();
}
suma.onclick = function(e){
primern = pantalla.value;
resultado2 = "+";
limpiar();
}
resta.onclick = function(e){
primern = pantalla.value;
resultado2 = "-";
limpiar();
}
multiplicacion.onclick = function(e){
primern = pantalla.value;
resultado2 = "*";
limpiar();
}
divicion.onclick = function(e){
primern = pantalla.value;
resultado2 = "/";
limpiar();
}
igual.onclick = function(e){
segundon = pantalla.value;
resolver();
}
porcentaje.onclick = function(e){
primern = pantalla.value;
resultado2 = "%";
resolver();
}
}
function limpiar (){
pantalla.value = "";
}
function recetear(){
pantalla.value = "";
primern = 0;
segundon = 0;
resultado2 = "";
}
//esto lo vi en java, tuve que buscar en mi ordenador donde tenia un ejercicio parecido que tenia.
function resolver(){
var res = 0;
switch(resultado2){
case "+":
res = parseFloat(primern) + parseFloat(segundon);
break;
case "-":
res = parseFloat(primern) - parseFloat(segundon);
break
case "*":
res = parseFloat(primern) * parseFloat(segundon);
break
case "/":
res = parseFloat(primern) / parseFloat(segundon);
break
case "%":
res = parseFloat(primern) / 100;
break
}
recetear();
pantalla.value = res;
}
*{
margin:0px;
padding:0px;
}
.contenedor{
}
.resultado{
font-size:30px;
font-family: Arial,Helvetica;
color:white;
border:0px;
background:black;
width:325.8px;
height:80px;
text-align:right;
}
.columna1{
font-size:30px;
font-family: Arial,Helvetica;
color:black;
border:0px;
background:#D6CFC9;
width:80px;
height:80px;
}
.columna2{
font-size:30px;
font-family: Arial,Helvetica;
color:white;
border:0px;
background:#FF821C;
width:80px;
height:80px;
}
#cero{
width:162px;
}
.fila{
font-size:30px;
font-family: Arial,Helvetica;
color:black;
border:0px;
background:#C9BDB3;
width:80px;
height:80px;
}
table{
background:#7E7E7D;
}
td input:active{
background:#fff;
}
<!DOCTYPE html>
<html>
<head>
<title>Calculadora</title>
</head>
<link rel="stylesheet" type="text/css" href="css/estilos.css">
<body onload="init();">
<div class="contenedor">
<form>
<table>
<tr>
<td colspan="4"><input class="resultado" id="pantalla" type="text" value=""></td>
</tr>
<tr>
<td><input class="fila" id="reset" type="button" value="AC"></td>
<td><input class="fila" id="backspace" type="button" value="←"></td>
<td><input class="fila" id="porcentaje" type="button" value="%"></td>
<td><input class="columna2" id="divicion" type="button" value="÷"></td>
</tr>
<tr>
<td><input class="columna1" id="numero7" type="button" value="7"></td>
<td><input class="columna1" id="numero8" type="button" value="8"></td>
<td><input class="columna1" id="numero9" type="button" value="9"></td>
<td><input class="columna2" id="multiplicacion" type="button" value="x"></td>
</tr>
<tr>
<td><input class="columna1" id="numero4" type="button" value="4"></td>
<td><input class="columna1" id="numero5" type="button" value="5"></td>
<td><input class="columna1" id="numero6" type="button" value="6"></td>
<td><input class="columna2" id="resta" type="button" value="-"></td>
</tr>
<tr>
<td><input class="columna1" id="numero1" type="button" value="1"></td>
<td><input class="columna1" id="numero2" type="button" value="2"></td>
<td><input class="columna1" id="numero3" type="button" value="3"></td>
<td><input class="columna2" id="suma" type="button" value="+"></td>
</tr>
<tr>
<td colspan="2"><input class="columna1" id="cero" type="button" value="0"></td>
<td><input class="columna1" id="decimal" type="button" value="."></td>
<td><input class="columna2" id="igual" type="button" value="="></td>
</tr>
</table>
</form>
<script language="javascript" type="text/javascript" src="js/Calculadora.js"></script>
</div>
</body>
</html>