Enmascaramiento de jQuery zip para varios formatos

Question

Tengo un requisito para enmascarar un campo zip para que permita el formato clásico de 5 dígitos zip (XXXXX) o 5 + 4 (XXXXX-XXXX).

pude así que algo como:

$('#myZipField').mask("?99999-9999"); 

pero la complicación viene del hecho de que el tablero no se debe mostrar si el usuario pone en sólo 5 dígitos.

Esto es lo mejor que se me ocurrió hasta ahora: podría extenderlo para insertar automáticamente el tablero cuando inserten el sexto dígito, pero el problema sería un comportamiento extraño al eliminarlo (podría evitar que eliminen el dash pero sería un parche en el parche y así sucesivamente, se convierte en una pesadilla):

$.mask.definitions['~']='[-]'; 
$("#myZipField").mask("?99999~9999", {placeholder:""}); 

¿hay alguna fuera del camino caja de hacer esto o qué tengo que rodar mi propia?

Answer 1

Usted no tiene que usar un complemento diferente Basta con mover el signo de interrogación, por lo que en lugar de:

$('#myZipField').mask("?99999-9999"); 

se debe utilizar:

$('#myZipField').mask("99999?-9999"); 

Después de todo, no es toda la cadena que es opcional, sólo el - y hacia adelante.

Answer 2

¿Por qué no hacer que el campo sea transparente y tener un objeto de texto detrás con la forma en gris claro? Entonces ven ####### - #### en el fondo, y luego lo manipulan para que desaparezcan mientras escriben. En ese punto, sugiere que deberían entrar en una carrera si quieren poner los cuatro adicionales, ¿verdad? Entonces, ¿podría simplemente manipular el script para insertar automáticamente el guión si se equivoca y escribe 6 números?

Answer 3

Si estás usando jQuery ya, hay probablemente cientos de plugins para máscaras, etc., por ejemplo: http://www.meiocodigo.com/projects/meiomask/

Así que no creo que lo tienes que rodar su propia

Answer 4

Este código postal es realmente simple, pero cuando se tiene un formato más complejo de manejar, aquí es cómo se soluciona con el plugin (desde el demo page):

var options = {onKeyPress: function(cep, e, field, options){ 
    var masks = ['00000-000', '0-00-00-00']; 
    mask = (cep.length>7) ? masks[1] : masks[0]; 
    $('.crazy_cep').mask(mask, options); 
}}; 

$('.crazy_cep').mask('00000-000', options);