Ir para conteúdo

POWERED BY:

Arquivado

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

xxabxx

função com evento onkeyup + função de mascara de moeda

Por , em Javascript

Recommended Posts

xxabxx    0

xxabxx
Postado

Boa tarde galera,

Estou tendo um problema e gostaria de saber se alguém pode me dar uma luz.

tenho um form com os campos:

Valor1

Valor 2 e assim por diante.

 

Mais abaixo tenho o campo

"valor total"

 

ambos usam mascara de moeda

 

nos campos de valor tenho uma mascara aplicada e um evento onkeyup para assim que digitar ir mostrando o valor no campo "total"

o problema que no campo "valor total", só consigo aplicar a mascara se usar o evento onblur, e eu gostaria de aplicar usando o onkeyup conforme fosse digitando já aparecesse correto!

 
<script type="text/javascript">
    function calculaNFaturado(){
 
        var valor = 0; 
        $('.despesas_n_faturada').each(function(i){ 
 
 
            valor = parseFloat($(this).val().replace(",","").replace(".","")) + valor ;
        }); 
 
        $('#valorNFaturado').val( valor ).replace(",","").replace(".",""); 
 
   }
   
 
 
</script>
 
 
 
<script type="text/javascript">
    function calculaTotal(){
        var valor = 0; 
        $('.calculaDespesas').each(function(i){ 
 
            valor = parseFloat($(this).val().replace(/[^\d]+/g,'')) + valor ;
        }); 
        $('#valorTotal').val( valor ).replace(/[^\d]+/g,''); //fora do loop
    }
</script>
 

<script> 
function mascaraTotal(){ 
$('.calculaDespesas').priceFormat({
                    prefix: 'R$',
                    centsSeparator: ',',
                    thousandsSeparator: '.'
                });
 
</script>



                  <td>
R$<input type="text" data-mask-maxlength="false" data-mask-reverse="true" data-mask="#.##0,00" name="despesas_n_faturada1" id="despesas_n_faturada-0" class="despesas_n_faturada" placeholder="Desepsas n/Faturadas" onkeyup="calculaNFaturado();" onblur=" mascaraTotal();">
</td>  

<input type="text" name="total_gasto_n_faturado"  class="calculaDespesas" id="valorNFaturado" onkeyup="up(this)" onBlur="calculaTotal();">

Compartilhar este post

Link para o post
Compartilhar em outros sites

kikombat    16

kikombat
Postado

fiz uma simulação que talvez possa ser reaproveitada por ti

vão ser necessárias algumas funções extras, mas o resultado vale a pena

<!DOCTYPE html>
<html lang="pt-BR">
    <head>
        <script src="js/jquery-2.1.4.min.js" type="text/javascript"></script>
        <script src="js/jquery.price_format.js" type="text/javascript"></script>
        <script>
            function fm(num) {
                var x = 0;
                if (num < 0) {
                    num = Math.abs(num);
                    x = 1;
                }
                if (isNaN(num)) {
                    num = "0";
                }
                var cents = Math.floor((num * 100 + 0.5) % 100);
                num = Math.floor((num * 100 + 0.5) / 100).toString();
                if (cents < 10) {
                    cents = "0" + cents;
                }
                for (var i = 0; i < Math.floor((num.length - (1 + i)) / 3); i++) {
                    num = num.substring(0, num.length - (4 * i + 3)) + '.'
                            + num.substring(num.length - (4 * i + 3));
                }
                var ret = num + ',' + cents;
                if (x == 1) {
                    ret = ' - ' + ret;
                }
                return ret;
            }

            function mf(moeda) {
                moeda = moeda.replace(".", "");
                moeda = moeda.replace(",", ".");
                return parseFloat(moeda);
            }

            function array_sum(array) {
                var key, sum = 0;
                if (array && typeof array === 'object' && array.change_key_case) {
                    return array.sum.apply(array, Array.prototype.slice.call(arguments, 0));
                }
                if (typeof array !== 'object') {
                    return null;
                }
                for (key in array) {
                    if (!isNaN(parseFloat(array[key]))) {
                        sum += parseFloat(array[key]);
                    }
                }
                return sum;
            }

            function atualizaTotal(input, output) {
                var v = $(input)
                        .map(function () {
                            return mf($(this).val())
                        }).get();
                $(output).val(fm(array_sum(v)));
            }

            $(function () {
                $('.grana').priceFormat({prefix: '', centsSeparator: ',', thousandsSeparator: '.'});
                $('#valores .valor').keyup(function (e) {
                    e.preventDefault();
                    atualizaTotal('#valores .valor', '#valores #total');
                });
            });
        </script>
        <title>Teste 1</title>
    </head>
    <body>
        <div class="container-fluid">                   
            <div id="valores">
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" class="valor grana"  /><br/>
                <input type="text" id="total" class="grana"/>
            </div>
        </div>
    </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