Publicado em 10 de abr.

Mascara de Peso com Preenchimento contrário

Fala galera...estou aqui mais uma vez buscando uma solução com vocês.

enfim....vamos lá!

Preciso criar uma máscara JS para peso e que seja mais ou menos assim:

- até 03 zeros antes da virgula;

- máx 04 zeros após a virgula;

- Quando clicar no input, devem aparecer a máscara com os zeros e ir preenchendo de trás pra frente;

Ex:
Se o peso for 256g, deve aparecer dessa forma: 0,0256

Se for 1,5kg, deve aparecer 1,5000

Fáacil né??

Galera, estou alguns dias tentando fazer isso e não estou tendo muito sucesso.

Já vi inúmeras dicas do WBruno(moderador) e NADAAAA!!!

sério, estou recorrendo pq estou realmente sem saída.

Não sou expert em js e estou bem longe disso.

conto com a juda de vcs.

abs

Discussão (4)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

William Bruno· 11 de abr.

Opa.. cara.. consegui resolver, só precisa refatorar a parte do zeroFill ali no if.(para o código ficar bonito)

<script type="text/javascript">
function id(el){
 return document.getElementById(el);
}
window.onload = function(){
	id('peso').onkeyup = function(){
 var v = this.value,
 integer = v.split(',')[0];

 v = v.replace(/\D/, "");
 v = v.replace(/^[0]+/, "");

 if(v.length <= 4 || !integer)
 {
 if(v.length === 1) v = '0,000' + v;
 if(v.length === 2) v = '0,00' + v;
 if(v.length === 3) v = '0,0' + v;
 if(v.length === 4) v = '0,' + v;
 } else {
 v = v.replace(/^(\d{1,})(\d{4})$/, "$1,$2");
 console.log('ae');
 }

 this.value = v;
	}
};
</script>
<input type="text" name="peso" id="peso" maxlength="8" />

EduardoAugustoPHP· 11 de abr.

SENSACIONAL Bruno!

Realmente resolveu.

Passei a noite toda tentando, tentando e tentando. e Hoje pela manhã eu consegui fazer com jQuery mas não funfou no FF (só no chrome).

Vou postar aqui o código só pra registro e pra ajudar quem precisar também.

Muito obrigado!!

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
	$("#busca").unbind().keypress(function(ev){
 var self = $(this);
 var caractere = (String.fromCharCode(ev.keyCode).replace(/\D/g, "") - 0) + "";
 if(!ev.keyCode) caractere = "";
 var limite = 5; var texto = (self.val().replace(/\D/g, "") - 0) + caractere;
	while(texto.length < limite) {
 texto = "0" + texto;
	};
 self.val(texto.replace(new RegExp("\(\\d{"+(limite-1)+"}$\)"), ",$1"));
	return false;
	})
	.keyup(function(ev){
	if(!String.fromCharCode(ev.keyCode) - 0 >= 0){
	$(this).keypress()
	}
	})
});
</script>

</head>
<body>
 <input type="text" id="busca" maxlength="8"/> Mais uma vez, muito obrigado Bruno.

Abraço!

William Bruno· 11 de abr.

caraca! hauhaua q treca cara!

Olha, aproveitei sua dúvida para fazer 2 posts no meu blog. Um já liberei hoje com o código, o outro vai pro ar na segunda-feira.

É esse projeto git aqui:

https://github.com/wbruno/formatWeight

Refatorei o zeroFill lá que eu tinha dito, e escrevi testes Jasmine pro código.

EduardoAugustoPHP· 12 de abr.

>
caraca! hauhaua q treca cara!

Olha, aproveitei sua dúvida para fazer 2 posts no meu blog. Um já liberei hoje com o código, o outro vai pro ar na segunda-feira.

É esse projeto git aqui:

https://github.com/wbruno/formatWeight

Refatorei o zeroFill lá que eu tinha dito, e escrevi testes Jasmine pro código.

Haaa show de bola..!!!

Eu fiz uma mudança nele bem básica.

Alterei a forma de selecionar e passei pra jQuery. Estou implementando como uma função jquery e logo estou com ela pronta e passo pra vc e a galera aqui! hehe