Javascript正则表达式返回true..然后是false..然后是true..等[重复]

Question

我在表单上写的验证有一个奇怪的问题。它是输入旁边的“检查用户名”按钮。输入默认值是用户名，例如“betamax”。当我按下“检查用户名”时，它会传递正则表达式并将用户名发送到服务器。服务器按预期运行并返回“2”以告诉 javascript 他们正在提交自己的用户名。

然后，当我再次单击该按钮时，正则表达式失败。显然没有任何东西发送到服务器，因为正则表达式失败。如果我再次按下按钮，正则表达式通过，然后用户名被发送到服务器。

我真的不知道是什么让它这样做！这对我来说毫无意义！

编辑：我已经在 Firefox 和 Chrome (mac) 中测试了这个问题

这是我的代码：

$j("#username-search").click(checkUserName);

function checkUserName() {
    var userName = $j("#username").val();


    var invalidUserMsg = 'Invalid username (a-zA-Z0-9 _ - and not - or _ at beginning or end of string)';
    var filter = /^[^-_]([a-z0-9-_]{4,20})[^-_]$/gi;
    if (filter.test(userName)) {
        console.log("Pass")
        $j.post(
        "/account/profile/username_check/", 
        { q: userName }, 
        function(data){
            if(data == 0) {
                $j("#username-search-results").html("Error searching for username. Try again?");
            }
            else if(data == 5) {
                $j("#username-search-results").html(invalidUserMsg);
            }
            else if(data == 4) {
                $j("#username-search-results").html("Username too short or too long.");
            }
            else if(data == 2) {
                $j("#username-search-results").html("This is already your username.");
            }
            else if(data == 3) {
                $j("#username-search-results").html("This username is taken.");
            }
            else if(data == 1){
                $j("#username-search-results").html("This username is available!");
            }
        });
    } else {
        console.log("fail")
        $j("#username-search-results").html(invalidUserMsg);
    }

    return false;

}

HTML：

<input name="username" id="username" value="{{ user.username }}" />
<input type="button" value="Is it taken?" id="username-search">
<span id="username-search-results"></span>

Answer 1

/^[^-_]([a-z0-9-_]{4,20})[^-_]$/gi;

您正在使用g（全局）RegExp。在 JavaScript 中，全局正则表达式具有状态：您第一次调用它们（使用 exec、test 等），您将获得给定字符串中的第一个匹配项。再次调用它们，您将获得下一个匹配项，依此类推，直到您没有匹配项并重置为下一个字符串的开头。你也可以写regex.lastIndex= 0来重置这个状态。

（这当然是一个绝对糟糕的设计，肯定会造成混乱并导致奇怪的错误。欢迎使用 JavaScript！）

您可以从RegExp 中省略g，因为您只测试一场比赛。

另外，我认为您不希望 [^-_] 出现在前面和后面。这将允许 any 字符在每一端，即。 *plop! 将是有效的。您可能正在考虑前瞻/后瞻断言，但它们在 JavaScript 中不可用。 （好吧，应该是前瞻，但它在 IE 中被破坏了。）建议改为：

/^[a-z0-9][a-z0-9_-]{2,18}[a-z0-9]$/i

Answer 2

[a-z0-9-_]

这是错误的，最后一个-必须在开头或结尾。

[a-z0-9_-]

这是否会导致这个问题，我不知道。

补充说明：

第一个和最后一个字符可以是任何不是- 或_ 的字符，而不是限制为a-z0-9

a-z0-9 不包含大写字符。为此，您需要a-zA-Z0-9。 在大多数 RegEx 引擎中，a-zA-Z0-9_ 可以缩短为 \w。我还没有在 JavaScript 中尝试过。