Как проверить специальные символы в текстовом поле и отобразить введенные специальные символы в сообщении об ошибке?

Question

Существует текстовое поле и кнопка, которая проверяет запись внутри текстового поля.
Это, если оно не должно проверять наличие незаконных символов в форме.
Предположим, что я вошел в следующее слово "Lorem #% Ipsum ^"

При нажатии на кнопку, должны произойти две вещи

• Если SRE какие-либо специальные символы, такие как # $%^&, то форма подача должна быть неудачной.
• сообщение об ошибке должно появиться как «Вы использовали недопустимые символы #,% и^в вашей форме»

Что такое лучший метод?
P.S: Мне нужно решение, не связанное с jquery.

Answer 1

Вы можете сделать это:

var invalidChars = str.match(/[^\w ]/g), output = ''; 
if (invalidChars) { 
    invalidChars = invalidChars.unique(); 
    var lastInvalidChar = invalidChars.pop(); 
    output = 'You have used the illegal character' + (invalidChars.length > 0 ? 's' : '') + ' ' + 
     invalidChars.join(', ') + (invalidChars.length > 0 ? ' and ' : '') + lastInvalidChar; 
} 

Здесь match и регулярное выражение /[^\w ]/g используется, чтобы получить все символы, которые не являются ни слова, ни символы пробела. Массив совпадающих недопустимых символов затем очищается от дубликатов с использованием настраиваемого метода unique (см. Ниже). Затем последний недопустимый символ удаляется из массива, чтобы добавить его, если необходимо, с помощью «и» в конце вывода. Остальные недопустимые символы (если они есть) затем соединяются с запятыми и объединены с последним недопустимым символом.

Поскольку JavaScript имеет встроенный в unique методе для удаления дубликатов, вы можете использовать этот метод:

Array.prototype.unique = function() { 
    var index = {}; 
    for (var i=0; i<this.length; ++i) { 
     if (!index.hasOwnProperty(this[i])) { 
      index[this[i]] = this[i]; 
     } 
    } 
    var clean = []; 
    for (var prop in index) { 
     if (index.hasOwnProperty(prop)) { 
      clean.push(index[prop]); 
     } 
    } 
    return clean; 
}; 

Обратите внимание, что эта реализация не Типобезопасная как значения используются в качестве имен свойств и, таким образом, оказались в строки. Таким образом, ["3",3].unique() возвращает ["3"], следовательно "3".toString() === (3).toString().

Answer 2

var myString = document.getElementById("myInputField").value; // gets the sentence 
var invalidChars = myString.replace(/[^#%\^]*/g, ""); //gets the chars | "#%^" in your case 
var response = ""; 

for(var i = 0; i < invalidChars.length; i+){ 
    response += (i > 0? (i == invalidChars-1 ? " and ": ", "):"") + invalidChars[i]; 
} 

if (response != "") { 
    alert("Your data contains invalid characters " + response); 
} 

Для получения дополнительной информации о JS регулярных выражений проверить

http://www.regular-expressions.info/javascript.html