2010-06-24 5 views
10

Ich habe eine Anforderung für die Maskierung eines Zip-Feld, so dass es die klassische 5 Ziffern PLZ (XXXXX) oder 5 + 4 Format (XXXXX-XXXX) ermöglicht.jQuery Zip-Maskierung für mehrere Formate

ich könnte so etwas wie:

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

aber die Komplikation kommt von der Tatsache, dass Strich sollte nicht angezeigt werden, wenn der Benutzer in nur 5 Ziffern legt.

Dies ist das Beste, was ich bisher gefunden habe - ich könnte es erweitern, um den Bindestrich automatisch einzufügen, wenn sie die sechste Stelle einfügen, aber das Problem wäre lustiges Verhalten beim Löschen (ich könnte sie davon abhalten, die dash aber es würde den Patch patchen und so weiter, wird es ein Alptraum):

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

gibt es aus dem Kasten heraus Art und Weise, dies zu tun oder muss ich meine eigene Rolle?

+1

ich das gleiche Problem haben, haben Sie jemals eine passende Lösung gefunden? Vielen Dank! –

+1

@BenL. nicht wirklich - ich landete aufteilen die Felder in mehreren Textfeldern – JohnIdol

+0

Dies könnte helfen: https://igorescobar.github.io/jQuery-Mask-Plugin/ –

Antwort

9

Sie rollen müssen muss kein anderes Plug-in verwenden. Genau das Fragezeichen bewegen, so dass statt:

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

sollten Sie verwenden:

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

Schließlich ist es nicht die gesamte Zeichenfolge, die optional ist, nur die - und weiter.

-1

Warum sollte das Feld nicht transparent sein und ein Textobjekt dahinter mit dem Formular in Hellgrau haben? Sie sehen also ####### - #### im Hintergrund und richten es dann so ein, dass die Buchstaben verschwinden, wenn sie tippen. An diesem Punkt schlägt es vor, dass sie einen Strich eingeben sollten, wenn sie die zusätzlichen vier setzen möchten, richtig? Dann könnten Sie das Skript einfach so einrichten, dass es den Bindestrich automatisch einfügt, wenn sie Fehler machen und 6 Zahlen eingeben?

0

Diese Postleitzahl ist eigentlich einfach, aber wenn man ein komplexeres Format zu behandeln haben, ist hier, wie es mit dem Plugin gelöst ist (aus dem 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); 
Verwandte Themen