Erlaube nur römische Zeichen in Textfeldern

Question

Ich finde einen Weg, um alle Textfelder in der Website akzeptieren nur römische Zeichen. Gibt es einen einfachen Weg, dies global zu tun?

Vielen Dank im Voraus.

Answer 1

ich auf die markierte Antwort auf die folgende Frage für die regex beziehen, die filtert nicht-lateinischen Buchstaben:

How to detect non-roman characters in JS?

Spoiler: die Regex ist /[^\u0000-\u024F\u1E00-\u1EFF\u2C60-\u2C7F\uA720-\uA7FF]/g

Alles was Sie jetzt brauchen, ist ein wenig mit jQuery Bastelei:

var myInputId = "#foo"; // Or whatever you wish to use. 
var input = $(myInputId); 
var exp = /[^\u0000-\u024F\u1E00-\u1EFF\u2C60-\u2C7F\uA720-\uA7FF]/g; 
input.blur(function() { 
    input.value = input.value.replace(exp, ""); 
}); 

Answer 2

In modernen Browsern <input> akzeptiert ein Attribut namens pattern. Dies erlaubt, die gültigen Zeichen in einem gegebenen Feld einzuschränken.

input:invalid { 
 
    background-color:red; 
 
}

<form> 
 
    <input type="text" pattern="[a-zA-Z\s\.\-_]+" /> 
 
    <button type="submit">Submit</button> 
 
</form>

Für alle anderen Browser Sie alle Formularfeld über jQuery finden können, überprüfen Sie, ob ein pattern -Attribut vorhanden ist, und überprüfen Sie es gegen den Wert eines bestimmten Feldes. Sie können auch nicht erlaubte Zeichen ersetzen:

$('form').on('keyup blur','input',function() { 
 
    if ($(this).val() && $(this).attr('pattern')) { 
 
    //var pattern = new RegExp('^'+$(this).attr('pattern')+'$', 'g'); 
 
    //$(this).toggleClass('invalid', pattern.match(!$(this).val())); 
 
    var pattern = new RegExp($(this).attr('pattern').replace(/\[/,'[^'), 'g'); 
 
    $(this).val($(this).val().replace(pattern,'')); 
 
    } 
 
});

input:invalid, 
 
input:invalid { 
 
    background-color:red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> 
 
<form> 
 
    <input type="text" pattern="[a-zA-Z\s\.\-_]+" /> 
 
    <button type="submit">Submit</button> 
 
</form>

Oh, Sie noch Formulareingaben auf der Server-Seite überprüfen möchten. Alle HTML- oder Javascript-Inhalte verhindern nicht, dass alle Besucher Ihrer Website fehlerhafte Inhalte einreichen.

Answer 3

Fügen Sie diesen Code in Ihre Masterseite zum Beispiel:

<script> 
    $(function(){ 
     $('input[type=text],textarea').keypress(function(e){ 
      var char = String.fromCharCode(e.which || e.charCode); 
      var rgx = /[\u0000-\u007F]/; 
      if (rgx.test(char) == false) 
       return false; 
      }) 
    }) 
</script>