Olá Pessoal,
Estou fazendo uma calculadora em Javascript e estou com duvida em dois pontos.
-
Preciso que essa calculadora faça cálculos de raiz quadrada, porém estou em duvida de como usar a função “Math.sqrt”.
-
Atualmente essa calculadora tem alguns campos tais como; t1, t2, operacao e resultado.
t1 = 1º valor digitado.
t2 = 2º valor digitado
operacao = é a operação que sera realizada divisão, soma, subtração, etc…
resultado = campo onde sera exibido o resultado de t1 + t2.
Preciso saber como fazer para que as operações realizadas em t1 + t2 sejam exibidas no campo de resultado.
Segue abaixo o código que criei:
<head>
<script>
var resultado = function() {
var t1 = document.getElementById("t1");
var t2 = document.getElementById("t2");
var operacao = document.getElementById("op");
var resultado = document.getElementById('r');
var result = t1.value + operacao.value + t2.value;
resultado.value = eval(result);
t1.value = '';
t2.value = '';
operacao.value = '';
}
//SOMA
var soma = function() {
var operacao = document.getElementById("op");
operacao.value = "+";
}
// SUBTRAÇÃO
var subtracao = function() {
var operacao = document.getElementById("op");
operacao.value = "-";
}
// MULTIPLICAÇÃO
var multipicacao = function() {
var operacao = document.getElementById("op");
operacao.value = "*";
}
//DIVISÃO
var divisao = function() {
var operacao = document.getElementById("op");
operacao.value = "/";
}
// RAIZ QUADRADA
var raiz = function() {
var operacao = document.getElementById("op");
operacao.value = Math.sqrt(Number);
}
// BOTOES DA CALCULADORA
var botoesCalculadora = function(n) {
var t1 = document.getElementById("t1");
var t2 = document.getElementById("t2");
var operacao = document.getElementById("op");
if (operacao.value == '') {
t1.value = t1.value + n;
} else {
t2.value = t2.value + n;
}
}
</script>
<style>
.t1 {
color: blue;
}
#t2 {
color: blue;
}
.btn {
width: 16px;
height: 16px;
text-align: center;
border-radius: 5px;
font-weight: bold;
background-color: gray;
color: white;
border-style: double;
padding: 5px 8px 5px 8px;
margin: 2px;
font-family: monospace;
display: inline;
line-height: 38px;
}
.btn:hover {
background-color: black;
cursor: pointer;
color: yellow;
}
.resultado {
text-align: right;
width: 136px;
border-style: double;
padding: 2px;
margin: 1px
}
.calculadora {
border: 1px double gray;
padding: 10px;
margin: 10px;
display: inline-block;
}
</style>
</head>
<body>
<!--CAMPOS PARA DIGITAR O VALOR 1 E 2 -->
t1: <input id="t1" type="text" name="t1">
t2: <input id="t2" type="text" name="t2">
operacao: <input id="op" type="text" name="operacao">
<div class="calculadora" >
<input id="r" class="resultado" type="text" name="resultado">
<!--BOTOES NUMERICOS-->
<div class="btn" onclick="botoesCalculadora(1)">1</div>
<div class="btn" onclick="botoesCalculadora(2)">2</div>
<div class="btn" onclick="botoesCalculadora(3)">3</div>
<div class="btn" onclick="soma()">+</div>
<div class="btn" onclick="botoesCalculadora(4)">4</div>
<div class="btn" onclick="botoesCalculadora(5)">5</div>
<div class="btn" onclick="botoesCalculadora(6)">6</div>
<div class="btn" onclick="subtracao()">-</div>
<div class="btn" onclick="raiz()">√¯</div>
<div class="btn" onclick="botoesCalculadora(7)">7</div>
<div class="btn" onclick="botoesCalculadora(8)">8</div>
<div class="btn" onclick="botoesCalculadora(9)">9</div>
<div class="btn" onclick="multipicacao()">X</div>
<div class="btn" onclick="botoesCalculadora(0)">0</div>
<div class="btn" onclick="resultado()">=</div>
<div class="btn" onclick="divisao()">/</div>
<div class="btn" onclick="document.getElementById('r').value = 0">C</div>
</div>
</body>
Poderiam me ajudar, por favor ?
Obrigado.
Abs