如何验证文本框中的特殊字符并在错误消息中显示输入的特殊字符？答案

【问题标题】：How to Validate special characters in a textbox and show entered special characters in the error message?如何验证文本框中的特殊字符并在错误消息中显示输入的特殊字符？
【发布时间】：2010-08-24 06:43:14
【问题描述】：

有一个文本框和一个用于验证文本框内条目的按钮。
如果它不应该验证表单中是否存在非法字符。
假设我输入了以下单词“Lorem# %ipsum^”

点击按钮后，会发生两件事

如果有像#$%^& 这样的特殊字符，那么表单提交应该会失败。
应该会弹出一条错误消息，例如“您在表单中使用了非法字符 #、% 和 ^”

最好的方法是什么？
P.S：我想要一个不涉及 jquery 的解决方案。

【问题讨论】：

真的有这个要求吗？使用“只允许使用字母、数字、下划线和连字符”之类的消息不是更明智吗？

标签： javascript regex validation

【解决方案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 方法从重复项中清除匹配的无效字符数组（见下文）。然后从数组中删除最后一个无效字符，必要时在输出末尾附加一个“and”。然后将剩余的无效字符（如果有的话）用逗号连接并与最后一个无效字符组合。

由于 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()。

【讨论】：

javascript 是怎么回事.. :P
@Gumbo：我想要的是一个没有 php 的 javascript 解决方案
@naveen：抱歉，不知何故，我在写答案时想到了 PHP。我已经用 JavaScript 实现对其进行了更新（基本相同）。
@Gumbo：很好的答案。不过，我发现了一个小错误。所以我正在改变前四行 var invalidChars = str.match(/[^\w ]/g);var output = ''; if (invalidChars) { invalidChars = invalidChars.unique(); var lastInvalidChar = invalidChars.pop();.. 因为如果 str.match 为 null 则无法调用 unioque 函数。我的方法对吗？

【解决方案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

【讨论】：