Ir para conteúdo
raphaelgs

Resultado da minha soma esta dando NaN

Recommended Posts

não estou conseguindo encaixar a logica para fazer a soma dar sem NaN

sendo que o campo do aluguel esta com o value vazio porque estou simulando caso o usuário não tenha aluguel.

 

segue abaixo meu código

<p class="campo1"><span>Mensalidade Faculdade: </span>R$<input id="mensalidade" value="10"></p>
<p class="campo1"><span>Aluguel: </span>R$<input id="aluguel" value=""></p>
<p class="campo1"><span>Água: </span>R$<input id="agua" value="30"></p>
<p class="campo1"><span>Luz: </span>R$<input id="luz" value="10"></p>
<script type="text/javascript">
    function despesas(){

        var mensalidade = document.getElementById("mensalidade").value;
        var aluguel = document.getElementById("aluguel").value;
        var agua = document.getElementById("agua").value;
        var luz = document.getElementById("luz").value;
        
        var total = parseInt(mensalidade) + parseInt(aluguel) + parseInt(agua) + parseInt(luz);

        document.getElementById("resultado").innerHTML = total;
    }

</script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

o seu problema é simples você está tendo o erro 'NaN', porque o parseInt não consegue converter vazio para inteiro, é necessário que você crie uma validação e quando o valor for vazio deve substituir por zero (0). Mas o correto mesmo é que você utilizasse parseFloat pois está lidando com valores monetários e é muito comum lidar com valores fracionados.

 

HTML:

<p class="campo1"><span>Mensalidade Faculdade: </span>R$<input id="mensalidade" value="10"></p>
<p class="campo1"><span>Aluguel: </span>R$<input id="aluguel" value=""></p>
<p class="campo1"><span>Água: </span>R$<input id="agua" value="30"></p>
<p class="campo1"><span>Luz: </span>R$<input id="luz" value="10"></p>

<label>
  Resultado:
  <span id="resultado"></span>
</label>

<button onclick="despesas()">Calcular despesas</button>

JS:

function despesas(){
  var mensalidade = document.getElementById("mensalidade").value;
  var aluguel = document.getElementById("aluguel").value;
  var agua = document.getElementById("agua").value;
  var luz = document.getElementById("luz").value;

  var total = validValue(mensalidade) + validValue(aluguel) + validValue(agua) + validValue(luz);

  document.getElementById("resultado").innerHTML = total;
}

function validValue(value) {
  if(!value) {
    return 0;
  } else {
    return parseInt(value);
  }
}

exemplo: https://jsbin.com/sifeyugavu/edit?html,js,console,output

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por tiagocaus
      Ao desmarcar um checkbox o calculo não está sendo feito da forma correta.

      Não consegui identificar o problema, poderia ajudar?


      Link do código:https://jsfiddle.net/cwsmo4et/


      Obrigado.
    • Por Bruno123
      Olá, estou com uma dúvida na hora  de retornar se o número é primo ou não, poderiam me ajudar por gentileza ? Obrigado !
      <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title></title> </head> <body> <script src="javascript.js"></script> </body> </html> 'use strict' let num = prompt("Insira um número:"); let c = 0; for (i = 1; i <= num; i++) { if (num % i == 0) { c++; } } if (c == 2) { alert ("É PRIMO") } else { alert("NÃO É PRIMO") }  
    • Por ErikaLiy
      Estou começando agora com html e estou criando um site. Gostaria de saber se é possível reutilizar o código html em outras paginas. Por exemplo, todas as páginas do site terão o mesmo menu. Como faço para não precisar ficar colocando o mesmo código em todas as páginas? E caso também eu precise alterar algo, por exemplo incluir ou excluir um botão, eu consiga alterar apenas uma vez e não tenha que fazer isso de página por página.
    • Por user32
      Olá pessoal,
      sempre fui um curioso na programação e agora estou começando entender o javascript.
       
      edit:
      como eu consiguiria fazer a variavel buscar alem de 9... como numeros como 10-20, 20-30 ?
      toda ajuda é bem vinda, desde já agradeço
       
       
      <script type="text/javascript"> function funcao1() { var num1 = Number(document.getElementById("num1").value); var elemResult = document.getElementById("total"); var d90 = /[0-3]/; var d80 = /[4-5]/; var d70 = /[6-9]/; if (d90.test(num1)) { elemResult.innerText = String(num1 * "1") + "."; } else if (d80.test(num1)) { elemResult.innerText = String(num1 * "2") + "."; } else if (d70.test(num1)) { elemResult.innerText = String(num1 * "3") + "."; } else { // IE elemResult.innerText = String(num1 * "5") + "."; } } </script>  
×

Informação importante

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