Autor Tema: JavaScript calculadora con inputs suma resta multiplicación división jQuery (Leído 10202 veces)

condor12 · « **en:** 12 de Julio 2017, 23:34 »

Quiero hacer una calculadora con 3 inputs, en la que en los que se puedan ingresar 2 números en los 2 primeros y el resultado aparezca en el tercero, pero no logro que me funcione.

El código que he hecho es este:

Código: [Seleccionar]

<!DOCTYPE html>
<html lang="es">
<head>
	<link rel="stylesheet" type="text/css" href="Estilo.css">
	<meta charset="UTF-8">
	<title>Calculadora</title>
</head>
	

<body>

Numero 1 <input id="a" type="Number"/><br>
Numero 2 <input id="b" type="Number"/><br>
Resultado: <input id="r" type="Number"/>

<input type="button" value="suma" onclick="suma()"/>

<input type="button" value="resta" onclick="resta()"/>
 
<input type="button" value="multiplicacion" onclick="multiplicacion()"/>

<input type="button" value="division" onclick="division()"/>


<script>
	
function suma() {
	var numero1 = document.getElementsById('a').value;
	var numero2 = document.getElementsById('b').value;
	var resultado = parseInt(numero1) + parseInt(numero2);
	document.getElementsById('r').value = resultado;
}

function resta() {
	var numero1 = document.getElementsById('a').value;
	var numero2 = document.getElementsById('b').value;
	var resultado = parseInt(numero1) - parseInt(numero2);
	document.getElementsById('r').value = resultado;
}

function multiplicacion() {
	var numero1 = document.getElementsById('a').value;
	var numero2 = document.getElementsById('b').value;
	var resultado = parseInt(numero1) * parseInt(numero2);
	document.getElementsById('r').value = resultado;
}

function division() {
	var numero1 = document.getElementsById('a').value;
	var numero2 = document.getElementsById('b').value;
	var resultado = parseInt(numero1) / parseInt(numero2);
	document.getElementsById('r').value = resultado;
}

</script>
</body>
</html>

¿que hago mal?

DRANXZ88 · « **Respuesta #1 en:** 13 de Julio 2017, 19:27 »

Este sección es solo para presentación tenes que pegar en el otro sector de foro.
En cuando tu ejercicios yo resolví usando jquery te voy a pegar un ejemplo si por ahí te sirve de guía.

Código: [Seleccionar]

<!DOCTYPE html>
<html lang="es">
<head>
   <link rel="stylesheet" type="text/css" href="Estilo.css">
   <meta charset="UTF-8">
   <title>Calculadora</title>
</head>
   

<body>

Numero 1 <input id="a" type="Number"/><br>
Numero 2 <input id="b" type="Number"/><br>
Resultado: <input id="r" type="text" readonly="readonly"/>

<input type="button" value="suma" onclick="suma()"/>

<input type="button" value="resta" onclick="resta()"/>
 
<input type="button" value="multiplicacion" onclick="multiplicacion()"/>

<input type="button" value="division" onclick="division()"/>

<script src="https://code.jquery.com/jquery-3.2.1.min.js" type="text/javascript"></script>
<script>
   
function suma() {
   var numero1 = Number($("#a").val());
   var numero2 = Number($("#b").val());
   var sumar = numero1 + numero2;
   var resultado = $("#r").val(sumar);
}

function resta() {
   var numero1 = Number($("#a").val());
   var numero2 = Number($("#b").val());
   var sumar = numero1 - numero2;
   var resultado = $("#r").val(sumar);
}

function multiplicacion() {
   var numero1 = Number($("#a").val());
   var numero2 = Number($("#b").val());
   var sumar = numero1 * numero2;
   var resultado = $("#r").val(sumar);
}

function division() {
   var numero1 = Number($("#a").val());
   var numero2 = Number($("#b").val());
   var sumar = numero1 / numero2;
   var resultado = $("#r").val(sumar);
}

</script>
</body>
</html>

Podes probar cargándole numero y apretar los botones que pusiste y veras que ya calcula dependiendo que botón aprieta cambia de valor. También modifique que el resultado no sea edita-ble.

condor12 · « **Respuesta #2 en:** 27 de Julio 2017, 05:52 »

ok disculpas y muchas gracias por su ayuda

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias: