Mascara de Moeda em javascript

Programação Java
#1

Olá pessoal estou com o problema ao tentar fazer uma mascara de moeda em javascript. Aí segue o código e o erro, quem poder ajudar agradeço.

function MascaraMoeda(objTextBox, SeparadorMilesimo, SeparadorDecimal, e){
var sep = 0;
var key = ‘’;
var i = j = 0;
var len = len2 = 0;
var strCheck = ‘0123456789’;
var aux = aux2 = ‘’;
var whichCode = (window.Event) ? e.which : e.keyCode;
if (whichCode == 13) return true;
key = String.fromCharCode(whichCode); // Valor para o código da Chave
if (strCheck.indexOf(key) == -1) return false; // Chave inválida
len = objTextBox.value.length;
for(i = 0; i < len; i++)
if ((objTextBox.value.charAt(i) != ‘0’) && (objTextBox.value.charAt(i) != SeparadorDecimal)) break;
aux = ‘’;
for(; i < len; i++)
if (strCheck.indexOf(objTextBox.value.charAt(i))!=-1) aux += objTextBox.value.charAt(i);
aux += key;
len = aux.length;
if (len == 0) objTextBox.value = ‘’;
if (len == 1) objTextBox.value = ‘0’+ SeparadorDecimal + ‘0’ + aux;
if (len == 2) objTextBox.value = ‘0’+ SeparadorDecimal + aux;
if (len > 2) {
aux2 = ‘’;
for (j = 0, i = len - 3; i >= 0; i–) {
if (j == 3) {
aux2 += SeparadorMilesimo;
j = 0;
}
aux2 += aux.charAt(i);
j++;
}
objTextBox.value = ‘’;
len2 = aux2.length;
for (i = len2 - 1; i >= 0; i–)
objTextBox.value += aux2.charAt(i);
objTextBox.value += SeparadorDecimal + aux.substr(len - 2, len);
}
return false;
}

Exemplo de utilização:

Valor R$:

Erro: O objeto não dar suporte para propriedade ou metodo.

#2

Olá,

Segue o código funcionando da função funcionando…

<html>
<head>
<body>

<script language="javascript">
//-----------------------------------------------------
//Funcao: MascaraMoeda
//Sinopse: Mascara de preenchimento de moeda
//Parametro:
//   objTextBox : Objeto (TextBox)
//   SeparadorMilesimo : Caracter separador de milésimos
//   SeparadorDecimal : Caracter separador de decimais
//   e : Evento
//Retorno: Booleano
//Autor: Gabriel Fróes - www.codigofonte.com.br
//-----------------------------------------------------
function MascaraMoeda(objTextBox, SeparadorMilesimo, SeparadorDecimal, e){
    var sep = 0;
    var key = '';
    var i = j = 0;
    var len = len2 = 0;
    var strCheck = '0123456789';
    var aux = aux2 = '';
    var whichCode = (window.Event) ? e.which : e.keyCode;
    if (whichCode == 13) return true;
    key = String.fromCharCode(whichCode); // Valor para o código da Chave
    if (strCheck.indexOf(key) == -1) return false; // Chave inválida
    len = objTextBox.value.length;
    for(i = 0; i < len; i++)
        if ((objTextBox.value.charAt(i) != '0') && (objTextBox.value.charAt(i) != SeparadorDecimal)) break;
    aux = '';
    for(; i < len; i++)
        if (strCheck.indexOf(objTextBox.value.charAt(i))!=-1) aux += objTextBox.value.charAt(i);
    aux += key;
    len = aux.length;
    if (len == 0) objTextBox.value = '';
    if (len == 1) objTextBox.value = '0'+ SeparadorDecimal + '0' + aux;
    if (len == 2) objTextBox.value = '0'+ SeparadorDecimal + aux;
    if (len > 2) {
        aux2 = '';
        for (j = 0, i = len - 3; i >= 0; i--) {
            if (j == 3) {
                aux2 += SeparadorMilesimo;
                j = 0;
            }
            aux2 += aux.charAt(i);
            j++;
        }
        objTextBox.value = '';
        len2 = aux2.length;
        for (i = len2 - 1; i >= 0; i--)
        objTextBox.value += aux2.charAt(i);
        objTextBox.value += SeparadorDecimal + aux.substr(len - 2, len);
    }
    return false;
}
</script>
Exemplo de utilização:
<form>
Valor R$: <input type="text" name="valor"  onKeyPress="return(MascaraMoeda(this,'.',',',event))">
</form>

 
</body>

</head>

</html>
#3

Valeu Bruno pela tentativa, mas esse código e igualzinho ao que estou usando.
Tentei esse aí e continua o mesmo erro.
Erro: O objeto não dar suporte para propriedade ou metodo.

Valeu

#4

Josias.java,

Você testou o código que eu postei dando ctrl+c e ctrl+v ?
porque eu tinha testado o que você postou e ele não estava funcionando (talvez porque na hora de copiar ele tenha colocado alguns caracteres estranhos…).
Esse código que eu postei está funcionando aqui na minha máquina…
pode ser alguma incompatibilidade com o browser …

Att

#5

Olá brunolinsalves!

Eu estou usando sua máscara e funciona !!!
A única coisa, é que tento apagar os digitos e não apaga, com vc tbm é assim???

Obrigada pela mascara!

#6

Olá Inah,

Esse post fazia tanto tempo que eu já tinha esquecido dele… =P

Realmente, testei aqui e não está apagando os dígitos.
Para corrigir isso, basta alterar essa linha:

 if (whichCode == 13) return true;

Deixando ela assim:

if (whichCode == 13 || whichCode == 8) return true;

Ou seja, fiz apenas incluir o keyCode da tecla Backspace nesse if.

segue o novo código completo:

 <html>  
 <head>  
 <body>  
   
 <script language="javascript">  
 //-----------------------------------------------------  
 //Funcao: MascaraMoeda  
 //Sinopse: Mascara de preenchimento de moeda  
 //Parametro:  
 //   objTextBox : Objeto (TextBox)  
 //   SeparadorMilesimo : Caracter separador de milésimos  
 //   SeparadorDecimal : Caracter separador de decimais  
 //   e : Evento  
 //Retorno: Booleano  
 //Autor: Gabriel Fróes - www.codigofonte.com.br  
 // 
 // Alteração: Alteração para a permissão de pagar o conteúdo do componente.
 // Autor: Bruno Lins Alves - www.brunolinsalves.com
 //-----------------------------------------------------  
 function MascaraMoeda(objTextBox, SeparadorMilesimo, SeparadorDecimal, e){  
     var sep = 0;  
     var key = '';  
     var i = j = 0;  
     var len = len2 = 0;  
     var strCheck = '0123456789';  
     var aux = aux2 = '';  
     var whichCode = (window.Event) ? e.which : e.keyCode;  
     if (whichCode == 13 || whichCode == 8) return true;  
     key = String.fromCharCode(whichCode); // Valor para o código da Chave  
     if (strCheck.indexOf(key) == -1) return false; // Chave inválida  
     len = objTextBox.value.length;  
     for(i = 0; i < len; i++)  
         if ((objTextBox.value.charAt(i) != '0') && (objTextBox.value.charAt(i) != SeparadorDecimal)) break;  
     aux = '';  
     for(; i < len; i++)  
         if (strCheck.indexOf(objTextBox.value.charAt(i))!=-1) aux += objTextBox.value.charAt(i);  
     aux += key;  
     len = aux.length;  
     if (len == 0) objTextBox.value = '';  
     if (len == 1) objTextBox.value = '0'+ SeparadorDecimal + '0' + aux;  
     if (len == 2) objTextBox.value = '0'+ SeparadorDecimal + aux;  
     if (len > 2) {  
         aux2 = '';  
         for (j = 0, i = len - 3; i >= 0; i--) {  
             if (j == 3) {  
                 aux2 += SeparadorMilesimo;  
                 j = 0;  
             }  
             aux2 += aux.charAt(i);  
             j++;  
         }  
         objTextBox.value = '';  
         len2 = aux2.length;  
         for (i = len2 - 1; i >= 0; i--)  
         objTextBox.value += aux2.charAt(i);  
         objTextBox.value += SeparadorDecimal + aux.substr(len - 2, len);  
     }  
     return false;  
 }  
 </script>  
 Exemplo de utilização:  
 <form>  
 Valor R$: <input type="text" name="valor"  onKeyPress="return(MascaraMoeda(this,'.',',',event))">  
 </form>  
   
   
 </body>  
   
 </head>  
   
 </html>
#7

Muito Obrigada!!!

#8

Pessoal,

Estou procurando uma máscara que funcione corretamente tudo e esta dificil de achar.

Essa formatação quando vem apagando o valor com o backspace o valor não se formata e também a tecla tab não funciona.

Alguem tem alguma função mais completa ou corrigiu essa?

Att,

#9

Oi Ivan!

Utilizando essa máscara que o bruno enviou pra mim funcionou perfeitamente…é só colocar a correção que ele citou acima!

Boa sorte!

#10

[quote=Inah]Oi Ivan!

Utilizando essa máscara que o bruno enviou pra mim funcionou perfeitamente…é só colocar a correção que ele citou acima!

Boa sorte!
[/quote]

Olá,

Mais quando você da um backspace em um valor já digitado exemplo 1.000,00 ele se transforma em 1.000,0 e depois 1.000…

A função deveria ir formatando sempre o valor.

Att,

#11

Pessoal,

Estou tentando alterar esta função para que ao invez de ser 2 digitos seja 3 digitos no final exemplo: 999,999.999

Aguém saber como alterar ou tem alguma outra função?

Abraços e obrigado. :frowning:

#12

Pessoal,

Eu encontrei uma solução para deixar com 3 casas decimais para campo com 9 digitos, caso queira mais digitos basta implementar mais linhas e definir as posições.

Segue abaixo a função com minhas alterações.

function MascaraMoeda(objTextBox, SeparadorMilesimo, SeparadorDecimal, e){
var sep = 0;
var key = ‘’;
var i = j = 0;
var len = len2 = 0;
var strCheck = ‘0123456789’;
var aux = aux2 = ‘’;
var whichCode = (window.Event) ? e.which : e.keyCode;
if (whichCode == 13 || whichCode == 8) return true;
key = String.fromCharCode(whichCode); // Valor para o código da Chave
if (strCheck.indexOf(key) == -1) return false; // Chave inválida

len = objTextBox.value.length;

for(i = 0; i < len; i++){
    if ((objTextBox.value.charAt(i) != '0') && (objTextBox.value.charAt(i) != SeparadorDecimal)) break;
}
aux = '';

for(; i < len; i++){
    if (strCheck.indexOf(objTextBox.value.charAt(i))!=-1) aux += objTextBox.value.charAt(i);
}
aux += key;
len = aux.length;

if (len == 0) objTextBox.value = '';
if (len == 1) objTextBox.value = '0'+ SeparadorDecimal + '00' + aux;
if (len == 2) objTextBox.value = '0'+ SeparadorDecimal + '0' +aux;

if (len > 2) {
    aux2 = '';
    for (j = 0, i = len - 3; i >= 0; i--) {
        if (j == 3) {
            aux2 += SeparadorMilesimo;
            j = 0;
        }
        aux2 += aux.charAt(i);
        j++;
    }
    objTextBox.value = '';
    len2 = aux2.length;
    for (i = len2 - 1; i >= 0; i--){
        objTextBox.value += aux2.charAt(i);
    }
    objTextBox.value += SeparadorDecimal + aux.substr(len - 2, len);
    
   [b] // VERIFICA O TAMANHO DO CAMPO PARA REFORMATAR COM A CASA DECIMAL COM 3 DIGITOS[/b]
    if (aux.length == 4)
        objTextBox.value = aux.substr(0, 1) + SeparadorDecimal +  aux.substr(len - 3, len);
    else if (aux.length == 5)
        objTextBox.value = aux.substr(0, 2) + SeparadorDecimal +  aux.substr(len - 3, 3);
    else if (aux.length == 6)
        objTextBox.value = aux.substr(0, 3) + SeparadorDecimal +  aux.substr(len - 3, len);
    else if (aux.length == 7)
        objTextBox.value = aux.substr(0, 1) + SeparadorDecimal +  aux.substr(len - 6, 3)+ SeparadorDecimal +  aux.substr(len - 3, 3);
    else if (aux.length == 8)
        objTextBox.value = aux.substr(0, 2) + SeparadorDecimal +  aux.substr(len - 6, 3)+ SeparadorDecimal +  aux.substr(len - 3, 3);
    else if (aux.length == 9)
        objTextBox.value = aux.substr(0, 3) + SeparadorDecimal +  aux.substr(len - 6, 3)+ SeparadorDecimal +  aux.substr(len - 4, 3);
}

return false;

}

#13

Usa esse aqui que funciona perfeitamente, alem de ser simples de se utilizar
http://blog.caixadesolucoes.com.br/post/mascara-para-campos-monetarios-com-jquery-e-maskmoney

#14