Ir para conteúdo

POWERED BY:

Arquivado

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

guilhermea1b

usar os <select> com um IF

Por , em Javascript

Recommended Posts

guilhermea1b    0

guilhermea1b
Postado

Olá pessoal.

Meu problema é o seguinte, quero calcular o gasto de calorias com a formula "(Velocidade * Peso * 0,0175) * tempo", o problema que não estou conseguindo resolver e que eu quero alterar o valor 0,0175 com o <select> dessa forma: 

 

Pessoa coloca o

 

peso: 60kg;

velocidade: 2km/h

tempo: 40minutos

seleciona o aparelho : x

 

se ela selecionar o aparelho y vai mudar o valor. 

 

Meu código está da seguinte forma.

 

(código HTML)

 

<form id="formulario">
                                <fieldset>
                                     <legend>Cálculo do IMC</legend>

                                    <label for="kilos">Peso:</label>
                                    <input type="text" name="quilos"/>          

                                    <label for="velo">Velocidade do Exercicio:</label>
                                    <input type="text" name="velo"/>

                                    <label for="tempo">Tempo de Exercicio(minutos):</label>
                                    <input type="text" name="tempo"/>

                                    <label >Aparelhos</label>
                                    <select id="apa">
                                        <option value="1">Alongamento (aparelho)</option>
                                        <option value="2">Esqui</option>
                                        <option value="3">Simulador Caminhada</option>
                                        <option value="4">Simulador Cavalgada</option>
                                        <option value="5">Rotação dupla diagonal</option> 
                                        <option value="6">Rotação vertical</option>
                                        <option value="7">Pressão de Pernas</option>
                                        <option value="8">Multi-exercitador</option>
                                        <option value="9">Remada</option>
                                        <option value="10">Extensora e agachamento</option>
                                        <option value="11">Surf</option>  
                                    </select>
                                    

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

                                    <a href="#" onclick="calculaCALO()">Calcular</a>
                                    
                                </fieldset>
                            </form>

 

(Código em JS)

 

calcularCALO = function (){
var formulario = document.getElementById('formulario');

var kilos = +formulario.quilos.value;   
var velo = +formulario.velo.value;
var tempo = +formulario.tempo.value;
var apa = document.getElementById('apa');
var itemselect = apa.options[apa.selectedIndex].value;  
    
if (apa.target.value == '1') {
    var imc = (velo * kilos * 0,0175) * tempo;    
    formulario.imc.value = imc.toFixed(2);
} 

 

Nesse ponto do javascript pensei em usar um if e else para fazer isso colocando o value em cada aparelho se o aparelho "1" for selecionado vai calcular com 0,0175 agora se selecionar o aparelho 2 vai calcular com outro valor. 

 

PS(não coloquei o else pois ainda não fiz, se vocês tiverem alguma outra logica pode mudar a vontade em. )

 

Des de já agradeço, muito obrigado pelo espaço.  

 


 

 

 

 

 

 

 

 

 

Compartilhar este post

Link para o post
Compartilhar em outros sites

washalbano    54

washalbano
Postado

Olá!
Veja se isso te ajuda:
  

<!doctype html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
          integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css"
          integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">

</head>
<body>
<div class="container">
    <form id="formulario">
        <fieldset>
            <legend>Cálculo do IMC</legend>
            <div class="row">
                <div class="col-sm-6 form-group">
                    <label>Peso:</label>
                    <div class="input-group mb-3">
                        <input type="number" name="peso" step=".1" class="form-control text-right">
                        <div class="input-group-append">
                            <span class="input-group-text">kg</span>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label>Velocidade do Exercicio:</label>
                    <input type="text" name="velocidade" class="form-control">
                </div>
                <div class="col-sm-6">
                    <label>Tempo de Exercicio:</label>
                    <div class="input-group mb-3">
                        <input type="number" name="tempo" class="form-control">
                        <div class="input-group-append">
                            <span class="input-group-text">min</span>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label>Aparelho</label>
                    <select name="aparelho" class="custom-select">
                        <option value="1">Alongamento (aparelho)</option>
                        <option value="2">Esqui</option>
                        <option value="3">Simulador Caminhada</option>
                        <option value="4">Simulador Cavalgada</option>
                        <option value="5">Rotação dupla diagonal</option>
                        <option value="6">Rotação vertical</option>
                        <option value="7">Pressão de Pernas</option>
                        <option value="8">Multi-exercitador</option>
                        <option value="9">Remada</option>
                        <option value="10">Extensora e agachamento</option>
                        <option value="11">Surf</option>
                    </select>
                </div>
                <div class="col-sm-6">
                    <label for="imc">Calorias Gastas:</label>
                    <input type="text" name="imc" disabled="disabled" class="form-control">
                </div>
                <div class="col-12 text-right">
                    <a href="#" onclick="calcularCALO()" class="btn btn-primary">Calcular</a>
                </div>
            </div>
        </fieldset>
    </form>
</div>
<script type="text/javascript">

    calcularCALO = function () {
        var formulario = document.getElementById('formulario');

        var kilos = +formulario.peso.value;
        var velo = +formulario.velocidade.value;
        var tempo = +formulario.tempo.value;
        var apa = document.getElementsByName('aparelho')[0];

        var itemselect = apa.options[apa.selectedIndex].value;

        // valores para cada aparelho(option do select)
        var options = [
            null, // zero
            0.0175, // 1
            0.234, // 2
            0.308, // 3
            0.487, // 4
            0.574, // 5
            0.645, // 6
            0.756, // 7
            0.867, // 8
            0.978, // 9
            0.189, // 10
            0.19,  // 11
        ]

        var imc = (velo * kilos * options[itemselect]) * tempo;
        formulario.imc.value = imc.toFixed(2);
    }
</script>
</body>
</html>

 

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