why do variables and other problems not work in this code?

Question

why do variables and other problems not work in this code?

Navigation

#1 by (5 votes)

1

I need to make this calculator work but I do not know what's wrong:

var operandoa;
var operandob;
var operacion;

function init() {
	//variable
	var resultado = document.getElementById('resultado');
	var reset = document.getElementById('reset');
	var suma = document.getElementById('suma');
	var resta = document.getElementById('resta');
	var multiplicacion = document.getElementById('multiplicacion');
	var division = document.getElementById('division');
	var igual = document.getElementById('igual');
	var uno = document.getElementById('uno');
	var dos = document.getElementById('dos');
	var tres = document.getElementById('tres');
	var cuatro = document.getElementById('cuatro');
	var cinco = document.getElementById('cinco');
	var seis = document.getElementById('seis');
	var siete = document.getElementById('siete');
	var ocho = document.getElementById('ocho');
	var nueve = document.getElementById('nueve');
	var cero = document.getElementById('cero');

	//eventos
	uno.onclick = function (e) {
		resultado.textContent = resultado.textContent + "1";
	};
	dos.onclick = function (e) {
		resultado.textContent = resultado.textContent + "2";
	};
	tres.onclick = function (e) {
		resultado.textContent = resultado.textContent + "3";
	};
	cuatro.onclick = function (e) {
		resultado.textContent = resultado.textContent + "4";
	};
	cinco.onclick = function (e) {
		resultado.textContent = resultado.textContent + "5";
	};
	seis.onclick = function (e) {
		resultado.textContent = resultado.textContent + "6";
	};
	siete.onclick = function (e) {
		resultado.textContent = resultado.textContent + "7";
	};
	ocho.onclick = function (e) {
		resultado.textContent = resultado.textContent + "8";
	};
	nueve.onclick = function (e) {
		resultado.textContent = resultado.textContent + "9";
	};
	cero.onclick = function (e) {
		resultado.textContent = resultado.textContent + "0";
	};
	reset.onclick = function (e) {
		resetear();
	};
	suma.onclick = function (e) {
		operandoa = resultado.textContent;
		operacion = "+";
		limpiar();
	};
	resta.onclick = function (e) {
		operandoa = resultado.textContent;
		operacion = "-";
		limpiar();
	};
	multiplicacion.onclick = function (e) {
		operandoa = resultado.textContent;
		operacion = "*";
		limpiar();
	};
	division.onclick = function (e) {
		operandoa = resultado.textContent;
		operacion = "/";
		limpiar();
	};
	igual.onclick = function (e) {
		operandob = resultado.textContent;
		resolver();
	};
}

function limpiar() {
	resultado.textContent = "";
}

function resetear() {
	resultado.textContent = "";
	operandoa = 0;
	operandob = 0;
	operacion = "";
}
function resolver() {
	var res = 0;
	switch (operacion) {
		case "+":
			res = parceFloat(operandoa) + parceFloat(operandob) break;
		case "-":
			res = parceFloat(operandoa) - parceFloat(operandob) break;
		case "*":
			res = parceFloat(operandoa) * parceFloat(operandob) break;
		case "/":
			res = parceFloat(operandoa) / parceFloat(operandob) break;
	}
	resetear();
	resultado.textContent = res;
}

.calculadora{
	display: block;
	margin: 0 auto;
	padding: 20px;
	background-color: #DC4C46;
	width: 300px;
	height: 500px;
	border-radius: 25px;
}

.calculadora td button{
	display: block;
	width: 70px;
	height: 70px;
	font-size: 25px;
}

#resultado{
	display: block;
	text-align: center;
	font-size: 40px;
	margin-bottom: 50px;
	width: 300px;
	height: 100px;
	line-height: 100px;
	background-color: #fff;
	border-radius: 25px;
	overflow-y: scroll;
}

<!DOCTYPE html>
<html>

	<head>

		<meta charset="utf-8">
		<title>Calculadora con Javascript</title>
		<link rel="stylesheet" type="text/css" href="estilo.css">

	</head>

	<body onload="init();">

		<table class="calculadora">
			<tr>
				<td colspan="4"><span id="resultado"></span></td>
			</tr>
			<tr>
				<td><button id="siete">7</button></td>
				<td><button id="ocho">8</button></td>
				<td><button id="nueve">9</button></td>
				<td><button id="división">/</button></td>
			</tr>
			<tr>
				<td><button id="cuatro">4</button></td>
				<td><button id="cinco">5</button></td>
				<td><button id="seis">6</button></td>
				<td><button id="multiplicación">*</button></td>
			</tr>
			<tr>
				<td><button id="uno">1</button></td>
				<td><button id="dos">2</button></td>
				<td><button id="tres">3</button></td>
				<td><button id="resta">-</button></td>
			</tr>
			<tr>
				<td><button id="igual">=</button></td>
				<td><button id="reset">C</button></td>
				<td><button id="cero">0</button></td>
				<td><button id="suma">+</button></td>
			</tr>
		</table>

		<script src="Funcionalidad.js"></script>
	</body>

</html>

javascript html css

asked by Elriso 19.12.2017 в 02:15

source

1 answer

How does this Sed command work? [closed] localStorage utility

score 5 · Accepted Answer

You've got it right, but you have some basic syntax errors.

The first is that you have the id of multiplication and division accented with the tilde in the html, so when you try to save in javascript a variable with the element of DOM , it does not recognize any id .

Another error you have is in the parseFloat() , you have it written with c, parceFloat() is poorly written.

And the last one, is that you need a few periods and commas within switch before break;

var operandoa;
var operandob;
var operacion;

function init() {
	//variable
	var resultado = document.getElementById('resultado');
	var reset = document.getElementById('reset');
	var suma = document.getElementById('suma');
	var resta = document.getElementById('resta');
	var prod = document.getElementById('multiplicacion');
	var division = document.getElementById('division');
	var igual = document.getElementById('igual');
	var uno = document.getElementById('uno');
	var dos = document.getElementById('dos');
	var tres = document.getElementById('tres');
	var cuatro = document.getElementById('cuatro');
	var cinco = document.getElementById('cinco');
	var seis = document.getElementById('seis');
	var siete = document.getElementById('siete');
	var ocho = document.getElementById('ocho');
	var nueve = document.getElementById('nueve');
	var cero = document.getElementById('cero');

	//eventos
	uno.onclick = function (e) {
		resultado.textContent = resultado.textContent + "1";
	};
	dos.onclick = function (e) {
		resultado.textContent = resultado.textContent + "2";
	};
	tres.onclick = function (e) {
		resultado.textContent = resultado.textContent + "3";
	};
	cuatro.onclick = function (e) {
		resultado.textContent = resultado.textContent + "4";
	};
	cinco.onclick = function (e) {
		resultado.textContent = resultado.textContent + "5";
	};
	seis.onclick = function (e) {
		resultado.textContent = resultado.textContent + "6";
	};
	siete.onclick = function (e) {
		resultado.textContent = resultado.textContent + "7";
	};
	ocho.onclick = function (e) {
		resultado.textContent = resultado.textContent + "8";
	};
	nueve.onclick = function (e) {
		resultado.textContent = resultado.textContent + "9";
	};
	cero.onclick = function (e) {
		resultado.textContent = resultado.textContent + "0";
	};
	reset.onclick = function (e) {
		resetear();
	};
	suma.onclick = function (e) {
		operandoa = resultado.textContent;
		operacion = "+";
		limpiar();
	};
	resta.onclick = function (e) {
		operandoa = resultado.textContent;
		operacion = "-";
		limpiar();
	};
	multiplicacion.onclick = function (e) {
		operandoa = resultado.textContent;
		operacion = "*";
		limpiar();
	};
	division.onclick = function (e) {
		operandoa = resultado.textContent;
		operacion = "/";
		limpiar();
	};
	igual.onclick = function (e) {
		operandob = resultado.textContent;
		resolver();
	};
}

function limpiar() {
	resultado.textContent = "";
}

function resetear() {
	resultado.textContent = "";
	operandoa = 0;
	operandob = 0;
	operacion = "";
}
function resolver() {
	var res = 0;
	switch (operacion) {
		case "+":
			res = parseFloat(operandoa) + parseFloat(operandob); break;
		case "-":
			res = parseFloat(operandoa) - parseFloat(operandob); break;
		case "*":
			res = parseFloat(operandoa) * parseFloat(operandob); break;
		case "/":
			res = parseFloat(operandoa) / parseFloat(operandob); break;
	}
	resetear();
	resultado.textContent = res;
}

.calculadora{
	display: block;
	margin: 0 auto;
	padding: 20px;
	background-color: #DC4C46;
	width: 400px;
	height: 500px;
	border-radius: 25px;
}

.calculadora td button{
	display: block;
	width: 70px;
	height: 70px;
	font-size: 25px;
}

#resultado{
	display: block;
	text-align: center;
	font-size: 40px;
	margin-bottom: 50px;
	width: 300px;
	height: 100px;
	line-height: 100px;
	background-color: #fff;
	border-radius: 25px;
	overflow-y: scroll;
}

<!DOCTYPE html>
<html>

	<head>

		<meta charset="utf-8">
		<title>Calculadora con Javascript</title>
		<link rel="stylesheet" type="text/css" href="estilo.css">

	</head>

	<body onload="init();">

		<table class="calculadora">
			<tr>
				<td colspan="4"><span id="resultado"></span></td>
			</tr>
			<tr>
				<td><button id="siete">7</button></td>
				<td><button id="ocho">8</button></td>
				<td><button id="nueve">9</button></td>
				<td><button id="division">/</button></td>
			</tr>
			<tr>
				<td><button id="cuatro">4</button></td>
				<td><button id="cinco">5</button></td>
				<td><button id="seis">6</button></td>
				<td><button id="multiplicacion">*</button></td>
			</tr>
			<tr>
				<td><button id="uno">1</button></td>
				<td><button id="dos">2</button></td>
				<td><button id="tres">3</button></td>
				<td><button id="resta">-</button></td>
			</tr>
			<tr>
				<td><button id="igual">=</button></td>
				<td><button id="reset">C</button></td>
				<td><button id="cero">0</button></td>
				<td><button id="suma">+</button></td>
			</tr>
		</table>

	</body>

</html>