-1

Boa tarde, estou com uma dúvida relacionado a criação de uma função para uso genérico no javascript, a função é essa aqui:

   function calcular() {
      var_quant = 0;
      var valor = document.getElementById("valor").value;
      var quantidade = document.getElementById("quantidade").value;
      var quantidade_devolvida = 
      document.getElementById("quantidade_devolvida").value;


      if (quantidade_devolvida <= quantidade) {
        var var_quant = valor * quantidade_devolvida;
        document.getElementById("var_qnt").value = var_quant;
    }
}

Preciso transformar essa função em uma função que funcione em qualquer input. Por favor se alguém pude me ajudar eu agradeço muito.

2
  • Daniel, a quantidade é sempre fixa? Seria interessante vc mostrar a estrutura desses inputs pra saber o que varia e o que é fixo. E como vc está chamando essa função calcular, é clicando em botão?
    – Sam
    9/10/2018 às 16:37
  • Ele ocorre no próprio input do resultado final por um onChange, mas esses valores, quantidade, quantidade_devolvida e valor, vem de um json. 9/10/2018 às 17:06

2 Respostas 2

0

Para tornar uma função dinâmica, precisa usar os valores passados por referência dentro de sua função.

Ficaria da seguinte maneira:

function calcular(valor, quantidade, qt_devolvida, resultado) {
      var_quant = 0;
      var valor = document.getElementById(valor).value;
      var quantidade = document.getElementById(quantidade).value;
      var quantidade_devolvida = 
      document.getElementById(qt_devolvida).value;


      if (quantidade_devolvida <= quantidade) {
        var var_quant = valor * quantidade_devolvida;
        document.getElementById(resultado).value = var_quant;
    }
}

let button = document.getElementById('btn');
btn.addEventListener("click", function(){  
  calcular('valor', 'quantidade', 'quantidade_devolvida', 'var_qnt'); //chamada da função passando os ids dos elementos
})
<input type="text" id="valor" placeholder="Valor"/> <br><br>
<input type="text" id="quantidade" placeholder="Quantidade"/> <br><br>
<input type="text" id="quantidade_devolvida" placeholder="Quantidade devolvida"/> <br><br>
<input type="text" id="var_qnt" placeholder="Resultado" disabled/> <br> <br>
<button id="btn"> Calcular </button>

Obs: Lembre-se de passar os valores na função na ordem correta.

2
  • Desculpem pessoal, é a primeira vez que utilizo o fórum, mas o que eu preciso que é o id seja capturado de forma automática e que esses ids passem para a função de calculo. 9/10/2018 às 18:43
  • @DanielRezende é exatamente o que está sendo feito na função. Na chamada, você coloca os ids dos elementos em ordem como eu mencionei e os valores deles serão transferidos automaticamente para a função. Não sei o que quer dizer com "capturar id de forma automática".
    – Jorge.M
    9/10/2018 às 19:36
0

Você pode usar parâmetros na função, dessa forma:

function calcular(valor, quantidade, quantidade_devolvida) {
   var var_quant = 0;
   if (quantidade_devolvida <= quantidade) {
     var_quant = valor * quantidade_devolvida;
   }
   return var_quant;
}

E aí você pode usa-la da seguinte forma:

document.getElementById("var_qnt").value = calcular(
                                          document.getElementById("valor").value,
                                          document.getElementById("quantidade").value,
                                          document.getElementById("quantidade_devolvida").value);

Assim você pode passar os inputs vindos de qualquer lugar e centralizar o cálculo do output.

EDIÇÃO

Ou você pode usar um objeto também, para passar os valores para a função:

function calcular(objeto) {
   objeto.var_quant = 0;
   if (objeto.quantidade_devolvida <= objeto.quantidade) {
     objeto.var_quant = objeto.valor * objeto.quantidade_devolvida;
   }
}

var seu_objeto = {
    valor : document.getElementById("valor").value,
    quantidade : document.getElementById("quantidade").value,
    quantidade_devolvida : document.getElementById("quantidade_devolvida").value,
    var_quant : 0
};

calcular(seu_objeto);
document.getElementById("var_qnt").value = seu_objeto.var_quant;
6
  • Obrigado meu amigo, irei testar. 9/10/2018 às 17:07
  • Infelizmente acabou não funcionando 9/10/2018 às 17:45
  • Em que ponto não funcionou? Eu fiz um teste aqui com a primeira sugestão: jsfiddle.net/ynskmf2g, e com a segunda sugestão: jsfiddle.net/23Ltbxom, e ambos funcionaram. Embora eu tenha visto um outro erro no código (um parênteses a mais na definição do valor da propriedade quantidade_devolvida), que acabei de corrigir. 9/10/2018 às 17:59
  • @DanielRezende Antes de aceitar uma resposta, teste e comprove que é o que precisa.
    – Jorge.M
    9/10/2018 às 18:03
  • @PedroGaspar não entendi o motivo de "complicar" mais a função. Sem contar que você está capturando os elementos na chamada da função sendo que dentro da mesma os valores estão sendo capturados.
    – Jorge.M
    9/10/2018 às 18:16

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 .