14 de agosto de 2014
Script:

<script type = "text/javascript">
function calcularIMC(){
var formulario = document.getElementById("formulario"); <!--Recebe o id do código html do formulário-->

var kilos = +formulario.kilos.value; <!--Recebe o valor do campo "Kilos" do formulário. O '+' antes do valor converte o valor recebido de string para um número inteiro-->

var metros = +formulario.metros.value; <!--Recebe o valor do campo "Metros" do formulário. O '+' antes do valor converte o valor recebido de string para um número inteiro-->

var centimetros = +formulario.centimetros.value;<!--Recebe o valor do campo "Cm" do formulário. O '+' antes do valor converte o valor recebido de string para um número inteiro-->

var altura = (metros * 100 + centimetros)/100; <!--Faz o cálculo da altura -->
var imc = kilos / (altura * altura); <!--Faz o cálculo do IMC-->

formulario.imc.value = imc.toFixed(2);

}
</script>

Html Formulário:

<form id="formulario">
<fieldset>

<legend>Cálculo do IMC</legend>
<label for="kilos">Kilos:</label>
<input type="text" name="kilos"/>

<label for="metros">Metros:</label>
<input type="text" name="metros"/>

<label for="centimetros">Cm:</label>
<input type="text" name="centimetros"/>

<label for="imc">IMC:</label>
<input type="text" name="imc" disabled="disabled"/>

<a href="#" onclick="calcularIMC();">Calcular</a>

</fieldset>
</form>

Para ver o formulário funcionando, copie o código abaixo, cole no bloco de notas e salve como: calculoimc.html


<html>
<head>

<script type = "text/javascript">
function calcularIMC(){
var formulario = document.getElementById("formulario");
var kilos = +formulario.kilos.value;
var metros = +formulario.metros.value;
var centimetros = +formulario.centimetros.value;

var altura = (metros * 100 + centimetros)/100;
var imc = kilos / (altura * altura);

formulario.imc.value = imc.toFixed(2);

}
</script>

</head>

<body>

<form id="formulario">
<fieldset>

<legend>Cálculo do IMC</legend>
<label for="kilos">Kilos:</label>
<input type="text" name="kilos"/>

<label for="metros">Metros:</label>
<input type="text" name="metros"/>

<label for="centimetros">Cm:</label>
<input type="text" name="centimetros"/>

<label for="imc">IMC:</label>
<input type="text" name="imc" disabled="disabled"/>

<a href="#" onclick="calcularIMC();">Calcular</a>

</fieldset>
</form>

</body>
</html>

2 comentários:

  1. Muito Bom! Ficou Perfeito!

    ResponderExcluir
  2. Olá amiga, estou com dificuldade para criar um código no meu site do Wix, gostaria que o site apresentasse 4 campos para o usuário preencher v1,v2,v3,v4 sendo que v4 é moeda. Um quinto campo apresentaria o valor da seguinte conta v1/100*v2*v3/50. No sexto campo gostaria que apresentasse v4*v5 como moeda tb (v5=resultado de v1/100*v2*v3/50). E finalmente no sétimo campo a multiplicação de v6*24. Nem precisa colocar label nos campos pois edito com elementos visuais depois. Desde já agradeço a ajuda

    ResponderExcluir

Comentários:

Perfil

Formada em Sistemas de Informação e pós-graduada em Engenharia de Software.

Facebook

Views