Ainda não testei todas as máscaras, mas creio que devem estar funcionando perfeitamente
A única coisa que acho que poderia ser melhorada na parte das máscaras seria o limite de tamanho
Quanto ao programa em si, uma sugestão seria dar a liberdade ao usuário de passar o próprio elemento para a função, ao invés de passar seu nome no formulário.Exemplo:
JSM("formulario").mask({'campo':'document.getElementById("campo1")','mask':'telefone'})
Infelizmente isso não seria possível sem modificar o objeto JSM (já que no JSM está sendo atribuído o nome da máscara a uma propriedade com o nome do campo)
/**
* @author Eduardo Ottaviani
* @example JSM("formulario").mask({ "nome" : "phone" })
*/
function
JSM (form){ return new JSM.Class(form) }
JSM . add = function(json){ JSM.methods[json.name] = json.method }
JSM . methods = {}
JSM . Class = function(form){
ProcuraElemento=function(x,frm){
var e
if(frm){
e=frm[e]
}
if(!e){
e=document.getElementById(x)
if(!e){
try{
e=eval(x)
}catch(er){
e=x
}
}
}
return e
}
//Private:
var form = ProcuraElemento(form)
//Public:
this.inputs = {}
this.form = function(){return form}
this.test = function(object, mask){
var fn = JSM.methods[mask]
setTimeout( function(){ object.value = fn(object.value) },1 )
}
}
JSM.Class.prototype["mask"] = function(json){
var form = this.form()
var self = this
var addEvent = null
try{
if(!window.attachEvent) {throw "addEventListener"}
addEvent = function(event, obj, fn){ obj.attachEvent( "on"+event, fn )}
}
catch(eventListener){
if(!window[eventListener]) {throw "Não existe a feature no navegador"}
addEvent = function(event, obj, fn){obj.addEventListener(event, fn, false )}
}
name=json["campos"]
mask=json["masks"]
var nome_atual //Nome do elemento no loop corrente
var mask_atual //Nome da máscara no loop corrente
var elmt_atual //Armazena o elemento no loop corrente
var mascaras=[]
for(y=0;y<Math.min(name.split("|").length,mask.split("|").length);y++){
nome_atual=name.split("|")[y]
mask_atual=mask.split("|")[y]
elmt_atual=ProcuraElemento(nome_atual,form)
if(elmt_atual.id==""){
var elmt_id
elmt_id="JSM_mask_"
do{
elmt_id=parseInt(Math.random*1000)
}while(document.getElementById(elmt_id))
elmt_atual.id=elmt_id
}
mascaras[elmt_atual.id]=mask_atual
addEvent("keypress", elmt_atual, function(e){
self.test(this,mascaras[this.id])
})
}
}
// Funções de máscara foram pegas de:
http://elcio.com.br/ajax/mascara/ JSM.add({
"name":"digitos",
"method" : function(v){ return v.replace(/\D/g,"")}
})
JSM.add({
"name":"leech",
"method": function(v){
v=v.replace(/o/gi,"0")
v=v.replace(/i/gi,"1")
v=v.replace(/z/gi,"2")
v=v.replace(/e/gi,"3")
v=v.replace(/a/gi,"4")
v=v.replace(/s/gi,"5")
v=v.replace(/t/gi,"7")
return v
}
})
JSM.add({
"name":"telefone",
"method": function(v){
v=v.replace(/\D/g,"") //Remove tudo o que não é dígito
v=v.replace(/^(\d\d)(\d)/g,"($1) $2") //Coloca parênteses em volta dos dois primeiros dígitos
v=v.replace(/(\d{4})(\d)/,"$1-$2") //Coloca hífen entre o quarto e o quinto dígitos
v=v.substring(0,14) //Limita o número de dígitos do telefone
return v
}
})
JSM.add({
"name":"cpf",
"method": function(v){
v=v.substring(0,14) //Limite de caracteres para o CPF
v=v.replace(/\D/g,"") //Remove tudo o que não é dígito
v=v.replace(/(\d{3})(\d)/,"$1.$2") //Coloca um ponto entre o terceiro e o quarto dígitos
v=v.replace(/(\d{3})(\d)/,"$1.$2") //Coloca um ponto entre o terceiro e o quarto dígitos
//de novo (para o segundo bloco de números)
v=v.replace(/(\d{3})(\d{1,2})$/,"$1-$2") //Coloca um hífen entre o terceiro e o quarto dígitos
return v
}
})
JSM.add({
"name":"cep",
"method": function(v){
v=v.replace(/D/g,"") //Remove tudo o que não é dígito
v=v.replace(/^(\d{5})(\d)/,"$1-$2") //Esse é tão fácil que não merece explicações
v=v.substring(0,9) //Limita o número de caracteres do CEP
return v
}
})
JSM.add({
"name":"cnpj",
"method": function(v){
v=v.replace(/\D/g,"") //Remove tudo o que não é dígito
v=v.replace(/^(\d{2})(\d)/,"$1.$2") //Coloca ponto entre o segundo e o terceiro dígitos
v=v.replace(/^(\d{2})\.(\d{3})(\d)/,"$1.$2.$3") //Coloca ponto entre o quinto e o sexto dígitos
v=v.replace(/\.(\d{3})(\d)/,".$1/$2") //Coloca uma barra entre o oitavo e o nono dígitos
v=v.replace(/(\d{4})(\d)/,"$1-$2") //Coloca um hífen depois do bloco de quatro dígitos
v=v.substring(0,18) //Limita o número de caracteres do CNPJ
return v
}
})
JSM.add({
"name":"romanos",
"method": function(v){
v = v . toUpperCase() //Maiúsculas
v = v . replace(/[^IVXLCDM]/g,"") //Remove tudo o que não for I, V, X, L, C, D ou M
//Essa é complicada! Copiei daqui:
http://www.diveintopython.org/refactoring/refactoring.html while(v . replace(/^M{0,4}(CM|CD|D?C{0,3})(XC|XL|L?X{0,3})(IX|IV|V?I{0,3})$/,"")!="")
v = v . replace(/.$/,"")
return v
}
})
JSM.add({
"name":"site",
"method":function(v){
//Esse sem comentarios para que você entenda sozinho ;-)
v=v.replace(/^http:\/\/?/,"")
var dominio=v
var caminho=""
if(v.indexOf("/")>-1)
dominio = v.split("/")[0]
caminho = v.replace(/[^\/]*/,"")
dominio = dominio.replace(/[^\w\.\+-:@]/g,"")
caminho = caminho.replace(/[^\w\d\+-@:\?&=%\(\)\.]/g,"")
caminho = caminho.replace(/([\?&])=/,"$1")
if(caminho!="")
dominio = dominio.replace(/\.+$/,"")
v = "http://" + dominio + caminho
return v
}
})
JSM.add({
"name" : "data",
"method" : function (v){
v=v.replace(/\D/g,"")
v=v.replace(/(\d{2})(\d)/,"$1/$2")
v=v.replace(/(\d{2})(\d)/,"$1/$2")
return v
}
})
