0

preciso que um script jquery faça o seguinte:

TOTAL = Multa + Juros - Desconto.

que calcule mesmo se um dos 3 inputs não estiver preenchido.

achei uns exemplos na internet, porém todos precisam de uma ação, uma função ou um botão a precionar, mas tem que ser em tempo real.

Tentei isso mas não tive sucesso...

$(document).ready( function() {

    var multa = $('#multaSoValor').val();
    var juros = $('#jurosSovalor').val();
    var desconto = $('#descontoSoValor').val();

    var totalValorAdicionalDX = multa + juros - desconto;

    $('#totalValorAdicional').val('totalValorAdicionalDX'); 

});
3
  • 1
    O que quer dizer com "tempo real"? Ao ser digitado?
    – BrTkCa
    9/06/2017 às 18:15
  • isso, "em tempo real" > ao ser digitado em qualquer um dos campos... 9/06/2017 às 18:28
  • porém tem o seguinte, esses inputs multa, valor, desconto recebem um value de um outro js mas ao rodar no html o value fica vazio... 9/06/2017 às 18:31

3 Respostas 3

3

Se com "tempo real" você quer dizer ao ser digitado, eis um exemplo com keyup que é o evento disparado quando ao usuário libera uma tecla no teclado:

$(document).ready(function() {
  $("#multaSoValor,#jurosSovalor,#descontoSoValor").on('keyup', function() {

    var multa = parseFloat($('#multaSoValor').val()) || 0;
    var juros = parseFloat($('#jurosSovalor').val()) || 0;
    var desconto = parseFloat($('#descontoSoValor').val()) || 0;

    var totalValorAdicionalDX = multa + juros - desconto;

    $('#totalValorAdicional').val(totalValorAdicionalDX);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="multaSoValor">
<input id="jurosSovalor">
<input id="descontoSoValor">

<input id="totalValorAdicional">

0
1

Cria uma função que faça isso:

var fazerConta = (function(multa, juros, desconto, total) {
  return function() {
    total.value = (multa.value || 0) + (juros.value || 0) - (desconto.value || 0);
  }
})(
  document.getElementById('multaSoValor'),
  document.getElementById('jurosSovalor'),
  document.getElementById('descontoSoValor'),
  document.getElementById('totalValorAdicional')
);

E depois junta um auscultador para detectar mudanças e correr a função em tempo real.

$('#multaSoValor, #jurosSovalor, #descontoSoValor').on('change', fazerConta);
-1

Fiz um exemplo simples e funcional, qualquer dúvida só comentar.

jQuery('input').on('keyup',function(){
  var m = parseInt(jQuery('#multa').val() != '' ? jQuery('#multa').val() : 0);
  
  var j = parseInt(jQuery('#juros').val() != '' ? jQuery('#juros').val() : 0);
  
  var d = parseInt(jQuery('#desconto').val() != '' ? jQuery('#desconto').val() : 0);
  
  jQuery('#total').val((m + j) - d);
  
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" placeholder="Multa" name="multa" id="multa" value="">
<input type="text" placeholder="Juros" name="juros" id="juros" value="">
<input type="text" placeholder="Desconto" name="desconto" id="desconto" value="">
<br>
<br>
<input type="text" name="total" id="total" value="">

1

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 .