Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Felipeduarte13

Calculadora simples em HTML/JAVASCRIPT

Por , em Javascript

Recommended Posts

Felipeduarte13    0

Felipeduarte13
Postado

SOU INICIANTE E TENHO ESSA CALCULADORA SIMPLES E QUERIA

IMPLEMENTAR DUAS COISAS:

 

1- EXIBIR UMA MENSAGEM DE ERRO QUANDO O SEGUNDO VALOR FOR ZERO E A OPERAÇÃO ESCOLHIDA FOR A DIVISÃO;

2-QUANDO UM OPERANDO FOR SELECIONADO DESTACAR O CAMPO ALTERANDO SUA COR DE FUNDO. QUANDO O CAMPO PERDER O FOCO VOLTAR A COR ORIGINAL E EXIBIR O RESULTADO DA OPERAÇÃO EM NEGRITO.

 

 
<!DOCTYPE>
<html>    
    <head>    
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">    
        <title>Calculadora</title>    
    
        <script type="text/javascript">    
            function calculadora() {    
               var n1 = parseFloat(document.getElementById('n1').value);    
               var n2 = parseFloat(document.getElementById('n2').value);    
               var resultado = 0;  
               if (document.getElementsByName('operacao')[0].checked) {    
                   resultado = n1 + n2;  
               }    
               if (document.getElementsByName('operacao')[1].checked) {    
                   resultado = n1 - n2;    
               }    
               if (document.getElementsByName('operacao')[2].checked) {    
                   resultado = n1 * n2;    
               }    
               if (document.getElementsByName('operacao')[3].checked) {    
                   resultado = n1 / n2;    
               }    
               document.getElementById('resultado').value = resultado;    
            }    
        </script>    
    
    </head>    
    <body>  
        <form action="#">  
        <p>  
            Número1: <input id="n1" type="text"><br>    
            Número2: <input id="n2" type="text">  
        </p>  
        <p>  
            <input type="radio" name="operacao" id="adicao" value="+" checked><label for="adicao">Adição</label><br>    
            <input type="radio" name="operacao" id="subtracao" value="-"> <label for="subtracao">Subtração</label><br>  
            <input type="radio" name="operacao" id="multiplicacao" value="*"> <label for="multiplicacao">Multiplicação</label><br>    
            <input type="radio" name="operacao" id="divisao" value="/"> <label for="divisao">Divisão</label><br>   
        </p>  
        <p>  
            Resultado: <input id="resultado" type="text">  
        </p>  
        <p>  
            <input type="button" value="Calcular" onclick="calculadora()">  
        </p>  
        </form>  
    </body>    
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Beuleal    4

Beuleal
Postado

  1. verifique se n2 == 0, e tome sua decisão

para cor de fundo, você pode usar css, setando document.getElementById('n2').style.background-color = "cor escolhida";

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito