Home » Programação » Criando Máscaras para moedas com JQuery

Criando Máscaras para moedas com JQuery

Criando Máscaras para moedas com JQuery

Criando Máscaras para moedas com JQuery

Esse plugin foi desenvolvido baseado no original “Masked Input Plugin“.  Com esse plugin fica super fácil criar máscaras para moedas.

Como utilizar:

Primeiramente você precisa chamar os arquivos jquery.min.js e jquery.maskMoney.js

<script src="jquery.min.js" type="text/javascript"></script>
<script src="jquery.maskMoney.js" type="text/javascript"></script>

Depois você insere o código que formata os campos

 <script type="text/javascript">
    $(function(){
        $("#valor").maskMoney();
    })
    </script>

 Vale lembrar que o #valor deve corresponder ao id do campo, ex:

<input type="text" id="valor" />

Para formatação em R$, utilize o seguinte script

<script type="text/javascript">
$(function(){
 $("#demo4").maskMoney({symbol:'R$ ', 
showSymbol:true, thousands:'.', decimal:',', symbolStay: true});
 })
</script>

Visite o site do Plugin MaskMoney

Veja alguns exemplos de máscaras

Veja também alguns valores da configuração padrão do maskMoney

  • symbol: o símbolo a ser usado antes de os valores do usuário. padrão: ‘EUA $’
  • showSymbol: definir se o símbolo deve ser exibida ou não. padrão: false
  • symbolStay: definir se o símbolo vai ficar no campo após o usuário existe no campo. padrão: false
  • thousands: o separador de milhares. padrão: ‘,’
  • decimal: o separador de decimal. padrão: ‘.’
  • precision: quantas casas decimais são permitidos. default: 2
  • defaultZero: quando o usuário entra em campo, ele define uma máscara padrão usando zero. default: true
  • allowZero: use esta configuração para impedir que os usuários entrando com zero. padrão: false
  • allowNegative: use esta configuração para impedir que os usuários entrando com valores negativos. padrão: false
{
symbol:'US$', // Simbolo
decimal:'.', // Separador do decimal
precision:2, // Precisão
thousands:',', // Separador para os milhares
allowZero:false, // Permite que o digito 0 seja o primeiro caractere
showSymbol:false // Exibe/Oculta o símbolo
}
Total Views: 4464 ,

17 comentários

  1. Obrigado. Ficou perfeito

  2. Segui os passos e funcionou, porém, este script entrou em conflito com um de data que uso Datepicker, parou de funcionar. O script que estiver declarado depois que funciona. Sabe o motivo?

    $(function() {
    $.datepicker.setDefaults( $.datepicker.regional[ “” ] );
    $( “#datepicker” ).datepicker( $.datepicker.regional[ “pt-BR” ] );
    });

    $(function(){
    $(“#valor”).maskMoney({symbol:’R$ ‘, showSymbol:true, thousands:’.’, decimal:’,’, symbolStay: true});
    });

    • Olá Cássia,
      Provavelmente algum conflito entre funções.
      Tentou inverter a ordem para ver se funciona? Veja também quantos jQuery estão sendo solicitado (as vezes o outro script também pede um jQuery ficando em duplicidade).

  3. Tem como aplicar a máscara diretamente na variável? e não no campo input? Quero imprimir dinamicamente valores no campo e quero que venha preenchido com a máscara. Como faço?

  4. Juliano Henrique Diniz

    Quando aplico a mascara no telefone de 9 dígitos, ele fica assim (99)9999-99999. Como faço para ficar assim: (99) 99999-9999? com 5 dígitos antes do – e 4 depois.

  5. Juliano Henrique Diniz

    Perdão. desconsidere meu comentário que acabei de fazer.
    Estou com duas guias abertas, uma sobre mascaras de telefone e uma de mascaras de moedas.
    Troquei as páginas na hora de enviar a pergunta.
    Desculpe-me!
    E aproveitando, usei a sua mascara de moedas. Funcionou certinho! Parabéns!

  6. Existem várias por aí, ineficientes e complicadas… a sua funcionou perfeitamente.Valeu!

  7. Rodrigo Magalhaes

    Muito Obrigado, funcionou perfeitamente.

    Para quem usa mais de duas bibliotecas jQuery, ou mais de uma versão e está dando conflito,
    usem o noConflict(); Foi assim que fiz, e deu tudo certo ;D

  8. Fábio, parabéns pelo post, mas fiquei com uma dúvida. O campo que receberá essa informação no mysql deverá estar com que Type?
    Gostaria de buscar esses valores e realizar operações.
    Obrigado!

  9. Comentando apenas para lhe agradecer. Seu post me ajudou muito hoje! Perfeito. =D

  10. Edmilson Vasconcelos

    Amigão, eu gostaria de agradecer muito! Estou na faculdade, e este site está me ajudando demais!

    Muito obrigado!!

  11. Antonio Carlos Teixeira

    Obrigado pela dica! A sua colaboração é muito importante pra todos nós internautas de plantão.

  12. Luiz Felipe Lopes

    Funfou demais aki!! Obrigado ! =)

  13. Simples e direto. Me ajudou muito.
    Parabéns e obrigado.

Deixe uma resposta