Heim >Web-Frontend >js-Tutorial >JavaScript-Notizen zu Formularen und regulären Ausdrücken

JavaScript-Notizen zu Formularen und regulären Ausdrücken

高洛峰
高洛峰Original
2016-11-26 09:57:171279Durchsuche

Reguläre Ausdrücke sind eine äußerst leistungsfähige Möglichkeit, Textzeichenfolgen zu validieren und zu formatieren. Durch die Verwendung regulärer Ausdrücke können komplexe Aufgaben, die sonst Dutzende Codezeilen erfordern würden, mit ein oder zwei Zeilen JavaScript-Code erledigt werden.
Ein regulärer Ausdruck ist ein in speziellen Symbolen geschriebenes Muster, das eine oder mehrere Textzeichenfolgen beschreibt. Er wird oft als einer der schwierigsten Teile der Programmierung angesehen, aber solange man die verwirrenden regulären Ausdrücke in sinnvolle kleine Teile zerlegt, ist der Die Syntax ist nicht schwer zu verstehen.
Das Folgende ist ein Beispiel für die Verwendung regulärer Ausdrücke zur Überprüfung von E-Mail-Adressen:
[html]
>
E-Mail-Validierung center">E-Mail-Validierung


  

        

="Senden" />



]
body {
color: #000;
background-color: #FFF;
}

input.invalid {
background-color: #FF9; > Rand: 2px roter Einschub;

label.invalid {
Farbe: #F00;
Schriftstärke: fett

script01.js
[javascript]
window.onload = initForms; 
 
function initForms() { 
    for (var i=0; i< document.forms.length; i++) { 
        document.forms[i].onsubmit = function() {return validForm ();} 
    } 

 
function validForm() { 
    var allGood = true; 
    var allTags = document.getElementsByTagName("*"); 
 
    for (var i=0; i        if (!validTag(allTags[i])) { 
            allGood = false; 
        } 
    } 
    return allGood; 
 
    function validTag(thisTag) { 
        var outClass = ""; 
        var allClasses = thisTag.className.split(" "); 
     
        for (var j=0; j            outClass += validBasedOnClass(allClasses[j]) + " "; 
        } 
     
        thisTag.className = outClass; 
     
        if (outClass.indexOf("invalid") > -1) { 
            invalidLabel(thisTag.parentNode); 
            thisTag.focus(); 
            if (thisTag.nodeName == "INPUT") { 
                thisTag.select(); 
            } 
            return false; 
        } 
        return true; 
         
        function validBasedOnClass(thisClass) { 
            var classBack = ""; 
         
            switch(thisClass) { 
                case "": 
                case "ungültig": 
               
                case "email": 
                    if (allGood && !validEmail(thisTag.value)) classBack = "invalid "; 
                Standard: 
                    classBack += thisClass; 
            } 
            return classBack; 
        } 
                ([.-]?w+)*(.w{2,3})+$/; 
 
           return re.test(email); 
        } 
         
        function invalidLabel(parentTag) { 
            if (parentTag.nodeName == "LABEL") { 
                parentTag.className += „ungültig“; 
            } 
        } 
    } 

Nun erklären wir die rote Codezeile:
Reguläre Ausdrücke beginnen und enden immer mit einem Schrägstrich (/).
Das Caretzeichen (^) gibt an, dass Sie diesen Ausdruck verwenden möchten, um nach Zeichenfolgen zu suchen, die mit einer bestimmten Zeichenfolge beginnen.
Der Ausdruck w stellt ein beliebiges einzelnes Zeichen dar, einschließlich a~z, A~Z, 0~9 oder Unterstrich.
Das Pluszeichen + bedeutet, nach einem oder mehreren Vorkommen des vorherigen Eintrags zu suchen.
Die vordere Klammer (zeigt eine Gruppe an.
Die eckigen Klammern [] werden verwendet, um anzuzeigen, dass jedes der Zeichen vorkommen kann. Diese eckige Klammer enthält das Zeichen .-, aber der Punkt hat eine besondere Bedeutung für reguläre Ausdrücke Es muss also ein Backslash vorangestellt werden, was bedeutet, dass es sich tatsächlich auf den Punkt selbst bezieht, nicht auf seine spezielle Bedeutung. Die Verwendung eines Backslashs vor einer speziellen Zeichenfolge wird als „Zeichen-Escapezeichen“ bezeichnet Der Eintrag wird möglicherweise nicht oder nur einmal angezeigt. Verwenden Sie nach dem Fragezeichen erneut w+, um anzuzeigen, dass nach dem Punkt oder Bindestrich einige andere Zeichen stehen müssen. Die Klammern danach zeigen an, dass der vorherige Eintrag möglicherweise nicht angezeigt wird oder mehrfach vorkommen.
Das @-Zeichen repräsentiert nur sich selbst und hat keine andere Bedeutung.
Als nächstes wird w+ verwendet, um anzugeben, dass der Domainname mit einem oder mehreren a~z beginnen muss , 0~9 oder ein Unterstrich. Es folgt auch ([.-]?w+)*, was bedeutet, dass Punkte oder Bindestriche im Suffix der E-Mail-Adresse zulässig sind.
Dann in einem Kreispaar. Erstellen Sie eine weitere Gruppe in Klammern: .w{2,3}, was angibt, dass Sie einen Punkt gefolgt von einigen Zeichen finden möchten. Die Zahl in den geschweiften Klammern gibt an, dass der vorherige Eintrag zwei- oder dreimal vorkommen kann Regulärer Ausdruck. Das Ende der Formel ist ein Dollarzeichen $, das angibt, dass die passende Zeichenfolge hier enden muss.

Return re.test(email); Diese Zeile ruft den im vorherigen Schritt definierten regulären Ausdruck ab und verwendet test (). Methode zur Überprüfung der Gültigkeit der E-Mail. Wenn Sie keine regulären Ausdrücke verwenden, müssen Sie Dutzende weiterer Codezeilen verwenden, um denselben Code zu vervollständigen
[Javascript]
Funktion validEmail(email) {
var invalidChars = " /:,;";
                                                   ) {
var badChar = invalidChars.charAt(k);
if (email.indexOf (badChar) > -1) {
return false;                                         > var atPos = email.indexOf("@",1);
if (atPos == -1) {
return false ;
}
if (email.indexOf("@", atPos+1) != -1) {
                                                                  }
return true; = "invalid";
}
                                                                                                                                                                                                                



Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn