Javascript-Validierung: Block Sonderzeichen

Wie kann ich verhindern, dass Benutzer die Eingabe von Sonderzeichen in das Textfeld ein. Ich will nur die zahlen und das Alphabet eingegeben werden ( Eingabe /Einfügen ).

Muster?

InformationsquelleAutor Shyju | 2009-05-25
  1. 8

    Haben Sie zwei Ansätze:

    1. überprüfen Sie die "keypress" - Ereignis. Drückt der Benutzer ein Sonderzeichen-Taste, stoppen Sie ihn genau dort
    2. überprüfen Sie die "onblur" - event: wenn das input-element den Fokus verliert, überprüfen deren Inhalt. Wenn der Wert ungültig ist, wird display eine dezente Warnung neben das Eingabefeld.

    Ich würde empfehlen die zweite Methode, weil seine weniger irritierend. Denken Sie daran, auch zu überprüfen onpaste . Wenn Sie nur die Tastendruck-Dann Können Wir es Kopieren und einfügen von speziellen Zeichen, so verwenden Sie onpaste auch einzuschränken Einfügen von speziellen Zeichen

    Darüber hinaus werde ich auch vorschlagen, dass Sie überdenken, wenn Sie wirklich wollen, um zu verhindern, dass Benutzer die Eingabe von Sonderzeichen. Denn viele Menschen haben,$, #, @ und * in Ihrer Passwörter.

    Ich nehme an, dass dies sein könnte, um zu verhindern, dass SQL-injection; wenn dem so ist: ist es besser, Sie behandeln die Kontrollen server-Seite. Oder noch besser, die Flucht der Werte und speichern diese in der Datenbank.

    • Begrenzung der Eingabe ist nicht unbedingt restriktiver, es könnte sich um die Eingabe von Telefonnummern, Postleitzahlen, Termine, etc. Aber +1 auf die Beratung für die doppelte überprüfung auf der server-Seite!
    InformationsquelleAutor jrharshath
  2. 16

    Versuchen, diese, diese Funktion erlaubt alphanumerische Zeichen und Leerzeichen:

    function alpha(e) {
    var k;
    document.all ? k = e.keyCode : k = e.which;
    return ((k > 64 && k < 91) || (k > 96 && k < 123) || k == 8 || k == 32 || (k >= 48 && k <= 57));
}

    in Ihre html:

    <input type="text" name="name"  onkeypress="return alpha(event)"/>
    • Warum testen Sie document.all zu bestimmen, Unterstützung für e.keyCode? Warum nicht test e.keyCode statt?
    • Technisch brauchen Sie nicht jede Gruppierung Klammern; && Vorrang vor ||.
    InformationsquelleAutor qbtrance.com
  3. 7

    Für spezielle Zeichen:

    var iChars = "!@#$%^&*()+=-[]\\\';,./{}|\":<>?";

for (var i = 0; i < document.formname.fieldname.value.length; i++) {
    if (iChars.indexOf(document.formname.fieldname.value.charAt(i)) != -1) {
        alert ("Your username has special characters. \nThese are not allowed.\n Please remove them and try again.");
        return false;
    }
}
    InformationsquelleAutor dLcreations
  5. 2

    Es würde Ihnen helfen... nehme an, Sie haben ein Formular "formname" - Formular und ein Textfeld mit "txt" name. dann können Sie verwenden Sie folgenden code, damit nur aphanumeric Werte

    var checkString = document.formname.txt.value;
if (checkString != "") {
    if ( /[^A-Za-z\d]/.test(checkString)) {
        alert("Please enter only letter and numeric characters");
        document.formname.txt.focus();
        return (false);
    }
}
    InformationsquelleAutor Sourabh
  6. 2

    Ich denke, dass die überprüfung keypress Veranstaltungen ist nicht völlig ausreichend ist, wie ich glaube, dass können die Benutzer kopieren/einfügen in input-Boxen, ohne dass ein Tastendruck.

    So onblur ist wohl etwas zuverlässiger (aber weniger sofort).

    Wirklich stellen Sie sicher, dass die Zeichen, die Sie nicht wollen, sind nicht in Eingabefelder (oder Texteingabefelder, etc.), Ich denke, Sie werden müssen

    1. überprüfen keypress (wenn Sie möchten, geben unmittelbares feedback) und
    2. überprüfen Sie auch onblur,
    3. sowie die Validierung von Eingaben auf dem server (das ist der einzige wirkliche Weg, um sicherzustellen, dass nichts unerwünschtes wird in den Daten).

    Die code-Beispiele in den anderen Antworten wird funktionieren, damit der client-Seite überprüft (nur nicht verlassen nur auf die Prüfung der keypress Veranstaltungen), aber wie gezeigt, in der akzeptierten Antwort, eine server-side-check wirklich erforderlich ist.

    InformationsquelleAutor user2771097
  7. 1

    Einige der Optionen sind veraltet wie heute. So watch out für diejenigen.

    Wenn Sie versuchen <input onkeypress="blockSpecialCharacters(event)" /> einer IDE wie WebStorm wird slash out Ereignis und sagen Sie:

    Veraltet symbol, das verwendet wird, berät docs für die bessere alternative

    Dann, wenn Sie die JavaScript console.log(e.keyCode) auch geben keyCode und sagen:

    Veraltet symbol, das verwendet wird, berät docs für die bessere alternative

    Jedenfalls habe ich es mithilfe von jQuery.

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js"></script>

<input id="theInput" />

<script>
    function blockSpecialCharacters(e) {
            let key = e.key;
            let keyCharCode = key.charCodeAt(0);

            //0-9
            if(keyCharCode >= 48 && keyCharCode <= 57) {
                return key;
            }
            //A-Z
            if(keyCharCode >= 65 && keyCharCode <= 90) {
                return key;
            }
            //a-z
            if(keyCharCode >= 97 && keyCharCode <= 122) {
                return key;
            }

            return false;
    }

    $('#theInput').keypress(function(e) {
        blockSpecialCharacters(e);
    });
</script>
    InformationsquelleAutor Ricky Dam
Schreibe einen Kommentar