1

Sempre aparece NaN na caixa que deveria sair o resultado, não consegui algo que me ajudasse na internet.

Cálculo do IMC !

  <script>
      calcularIMC = function (){
        var peso = document.getElementById("peso").value;    
        var altura = document.getElementById("altura").value;    
        var imc = (peso/Math.pow(altura,2));
        document.getElementById("imc1").value = eval(imc);
       } 
      </script>
</head>
<body>
    <form class="form-horizontal">
        <fieldset>

        <!-- Form Name -->
       <center><legend>Caculadora de IMC</legend></center>

        <!-- Text input-->
        <div class="form-group">
          <label class="col-md-4 control-label" for = "altura">Altura</label>  
          <div class="col-md-4">
          <input id="altura" name = "altura" 
                type="text" 
                placeholder="#,## m"
                class="form-control input-md">

          </div>
        </div>

        <!-- Text input-->
        <div class="form-group">
          <label class="col-md-4 control-label" for = "peso">Peso</label>  
             <div class="col-md-4">
                <input id="peso" 
                     name="peso" 
                     type="text"
                     placeholder="###,## kg"
                     class="form-control input-md">

          </div>
        </div>
        <!-- Button -->
        <div class="form-group">
             <label class="col-md-4 control-label" for=""></label>
                 <div class="col-md-4">
                     <type = "button" class="btn btn-primary" 
                         id = "resultadoIMC" 
                         onclick = "calcularIMC()">Calcular IMC</button>
                   </div>
           </div>

        <!-- Text input-->
        <div class="form-group">
             <label class="col-md-4 control-label" for="imc">IMC</label> 
                 <div class="col-md-4">
                     <input id="imc1" 
                     type = "text"
                     class="form-control input-md"><br>
                </div>
        </div><br>            
        </fieldset>
        </form>

    </body>
    </html>

2 Respostas 2

0

Faça um parseFloat pra que ele converta a string que está sendo capturada no campo de altura em um valor de número flutuante:

var altura = parseFloat(document.getElementById("altura").value);

1
  • Valeu amigo, uma coisa bobinha que nem passou pela cabeça deu certo !
    – jvdlb6
    Commented 9/04/2018 às 11:25
0

Olá,

Por mais que você preencha seus campos <input> com apenas números, eles ainda aceitam letras e outros caracteres, portanto o valor capturado é uma string. Você deve utilizar a função parseFloat() quando atribui estes valores às variáveis. Veja:

calcularIMC = function (){
    var peso = parseFloat(document.getElementById("peso").value);    
    var altura = parseFloat(document.getElementById("altura").value);
    var imc = (peso/(Math.pow(altura,2)));
    document.getElementById("imc1").value = eval(imc);
}

Além disto, para que o javascript capture o float corretamente, o número deve conter ponto, e não vírgula. Ex: Altura 1.88.

Para tratar isto você pode utilizar o método replace(). Desta forma:

var altura = document.getElementById("altura").value;
altura = altura.replace(",", ".");
altura = parseFloat(altura);
1
  • Obrigado pelas dicas, irei usar !
    – jvdlb6
    Commented 9/04/2018 às 11:26

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .