Javascript Regex Only Textbox

Question

Мне удалось найти решение для этого в C#/.net, но не для обычного веб-html. Если уже есть ответ, дайте мне знать, и я закрою вопрос.

Как создать текстовое поле, которое разрешит определенные символы (например, буквенно-цифровые) на основе заданного регулярного выражения (например, [a-zA-Z0-9])? Поэтому, если пользователь пытается ввести что-либо еще, вставьте его, оно будет удалено или не разрешено.

<input type="text" class="alphanumericOnly"> 

Answer 1

Основная функция будет таким:

string = string.replace(/[^a-zA-Z0-9]/g, '') 

Это заменит любой символ, который не описывается [a-zA-Z0-9].

Теперь вы можете либо поместить его непосредственно в элемент декларации:

<input type="text" class="alphanumericOnly" onkeyup="this.value=this.value.replace(/[^a-zA-Z0-9]/g, '')"> 

Или (как вы использовали класс подсказку) присвоить это поведение каждого input элемента с классом alphanumericOnly:

var inputElems = document.getElemenstByTagName("input"); 
for (var i=0; i<inputElems.length; i++) { 
    var elem = inputElems[i]; 
    if (elem.nodeName == "INPUT" && /(?:^|\s+)alphanumericOnly(?:\s+|$)/.test(elem.className) { 
     elem.onkeyup = function() { 
      this.value = this.value.replace(/[^a-zA-Z0-9]/g, ''); 
     } 
    } 
} 

Но, возможно, это проще сделать с помощью jQuery или другого фреймворка JavaScript:

$("input.alphanumericOnly").bind("keyup", function(e) { 
    this.value = this.value.replace(/[^a-zA-Z0-9]/g, ''); 
}); 

Answer 2

Если у вас есть вход, хранящуюся в переменной input ...

input.onkeyup(function(e) { 
    this.value = this.value.replace(/\W/g, ''); 
} 

После каждого нажатия клавиши значение входа будет лишен каких-либо не буквенно-цифровых символов.

Answer 3

Если вы используете метод .replace в событии keyup, вход будет мерцать с не буквенно-цифровыми символами по мере их ввода, что кажется неаккуратным и не соответствует таким людям OCD, как я.

уборщик подходом было бы связать с событием нажатия клавиши и отрицают символы, прежде чем они поступают на вход, как показано на следующем:

$('.alphanumericOnly').keypress(function(e){ 
    var key = e.which; 
    return ((key >= 48 && key <= 57) || (key >= 65 && key <= 90) || (key >= 95 && key <= 122)); 
}); 

Перечень основных кодов клавиш можно найти here, если этот конкретный набор не соответствует вашим конкретным потребностям.