0

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>

1 respuesta 1

1

Puedes hacerlo de esta forma:

backspace.onclick = function(e){
    borrar();
}

function borrar (){
    var value = pantalla.value;
    var newValue = value.substring(0,value.length - 1);
    pantalla.value = newValue;
}
3
  • aun nada si puedes ejecutar el código y comprobar talvez hay algo que tenga error. Commented el 24 abr. 2018 a las 22:57
  • Tienes que agregar el handler tambien. Ya edite mi respuesta.
    – alanfcm
    Commented el 24 abr. 2018 a las 22:59
  • muchas gracias ya funciona perfecto!!! Commented el 24 abr. 2018 a las 23:17

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.