Calculadora simples com Javascript

Post rápido, só disponibilizando um exemplo bem simples de calculadora desenvolvida com Javascript.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Exemplo calculadora Simples</title>
<script type="text/javascript">
 function opcao(){
 if(document.getElementById("operacao").value == ""){
 alert("Por favor selecione uma opeção");
 }
 if(document.getElementById("operacao").value == "1"){
 if(valida()){
 soma();
 }
 }
 if(document.getElementById("operacao").value == "2"){
 if(valida()){
 subtrair();
 }
 }
 if(document.getElementById("operacao").value == "3"){
 if(valida()){
 dividir();
 }
 }
 if(document.getElementById("operacao").value == "4"){
 if(valida()){
 multiplicar();
 }
 }
 }

function valida(){
 if(document.getElementById("valorX").value == "" || document.getElementById("valorY").value == ""){
 alert("Valor não informador");
 return false;
 }else{
 if(validanumero()){
 return true;
 }else{
 return false;
 }
 }

}
 function validanumero(){
 var valorX = document.getElementById("valorX").value;
 var valorY = document.getElementById("valorY").value;
 if(isNaN(valorX)){
 alert("Valor primeiro campo não numerico");
 return false;
 }
 if(isNaN(valorY)){
 alert("Valor do segundo campo não numerico");
 return false;
 }else{
 return true;
 }

}

function soma(){
 var valorX = document.getElementById("valorX").value;
 var valorY = document.getElementById("valorY").value;
 var resultado = parseInt(valorX) + parseInt(valorY);
 document.getElementById("resultado").value = resultado;

}
 function subtrair(){
 var valorX = document.getElementById("valorX").value;
 var valorY = document.getElementById("valorY").value;
 var resultado = parseInt(valorX) - parseInt(valorY);
 document.getElementById("resultado").value = resultado;

}
 function dividir(){
 var valorX = document.getElementById("valorX").value;
 var valorY = document.getElementById("valorY").value;
 var resultado = parseInt(valorX) / parseInt(valorY);
 document.getElementById("resultado").value = resultado;

}
 function multiplicar(){
 var valorX = document.getElementById("valorX").value;
 var valorY = document.getElementById("valorY").value;
 var resultado = parseInt(valorX) * parseInt(valorY);
 document.getElementById("resultado").value = resultado;

}

 </script>
 </head>

<body>
 <div id="principal">
 <form id="form">
 <input id="valorX" type="text" size="15"/>
 <select id="operacao" onblur="opcao()">
 <option id="valor" value="">escolha uma opção</option>
 <option id="valor" value="1">Somar</option>
 <option id="valor" value="2">Subtrair</option>
 <option id="valor" value="3">Dividir</option>
 <option id="valor" value="4">Multiplicar</option>
 </select>
 <input id="valorY" type="text" size="15" onblur="opcao()"/>
 <b>=</b>
 <input id="resultado" type="text" size="15" disabled="true"/>
 <input id="calcular" type="button" value="Calcular" onclick="opcao()"/>
 <input id="limpar" type="reset" value="Resetar"/>
 </form>
 </div>

</body>

</html>

O resultado final sera uma calculadora bem simples neste formato.

 


abraço galera e até o próximo.

Deixe uma resposta

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s