如何解决 Javascript 正则表达式模式中的意外量词？

Question

场景： 我使用以下正则表达式模式添加了一个客户端 url 验证器。该模式应该检查 URL 输入是否匹配。

^(?#Protocol)(?:(?:ht|f)tp(?:s?)\:\/\/|~\/|\/)?(?#Username:Password)(?:\w+:\w+@)?(?#Subdomains)(?:(?:[-\w]+\.)+(?#TopLevel Domains)(?:com|org|net|gov|mil|biz|info|mobi|name|aero|jobs|museum|travel|[a-z]{2}))(?#Port)(?::[\d]{1,5})?(?#Directories)(?:(?:(?:\/(?:[-\w~!$+|.,=]|%[a-f\d]{2})+)+|\/)+|\?|#)?(?#Query)(?:(?:\?(?:[-\w~!$+|.,*:]|%[a-f\d{2}])+=?(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)(?:&(?:[-\w~!$+|.,*:]|%[a-f\d{2}])+=?(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)*)*(?#Anchor)(?:#(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)?$

问题：

当我通过 IE 调试 ValidateOtherInstituteWebsite JavaScript 方法时，抛出 JavaScript runtime error - unexpected quantifier 错误。

支票：

我在我的 C# 服务器端验证方法中实现了相同的正则表达式，没有错误，并且正则表达式匹配得当。通过研究错误，编译器似乎是 interpreting some of the regex as code，但我看不出在哪里。

问题：

如何编辑此正则表达式模式以与 JavaScript 一起使用？

代码：

function ValidateOtherInstituteWebsite(sender, args) {

    var valid = false;

    alert("debug alert");
    var otherInstituteWebsiteText = $("#vs_institutewebsite").text();
    var otherInstituteWebsiteUrl = otherInstituteWebsiteText;

    var urlValidationRegex = new RegExp("^(?#Protocol)(?:(?:ht|f)tp(?:s?)\:\/\/|~\/|\/)?(?#Username:Password)(?:\w+:\w+@)?(?#Subdomains)(?:(?:[-\w]+\.)+(?#TopLevel Domains)(?:com|org|net|gov|mil|biz|info|mobi|name|aero|jobs|museum|travel|[a-z]{2}))(?#Port)(?::[\d]{1,5})?(?#Directories)(?:(?:(?:\/(?:[-\w~!$+|.,=]|%[a-f\d]{2})+)+|\/)+|\?|#)?(?#Query)(?:(?:\?(?:[-\w~!$+|.,*:]|%[a-f\d{2}])+=?(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)(?:&(?:[-\w~!$+|.,*:]|%[a-f\d{2}])+=?(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)*)*(?#Anchor)(?:#(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)?$");

    if (urlValidationRegex.test(otherInstituteWebsiteUrl))
    {
        valid = true;
    }

    args.IsValid = valid;

}

异常屏幕截图：

Answer 1

JS正则表达式不支持像(?#...)这样的注释，可以在支持自由空间（/x，冗长）模式的正则表达式风格中使用，您需要将它们全部删除。

使用

var urlValidationRegex = /^(?:(?:ht|f)tp(?:s?):\/\/|~\/|\/)?(?:\w+:\w+@)?(?:(?:[-\w]+\.)+(?:com|org|net|gov|mil|biz|info|mobi|name|aero|jobs|museum|travel|[a-z]{2}))(?::[\d]{1,5})?(?:(?:(?:\/(?:[-\w~!$+|.,=]|%[a-f\d]{2})+)+|\/)+|\?|#)?(?:(?:\?(?:[-\w~!$+|.,*:]|%[a-f\d{2}])+=?(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)(?:&(?:[-\w~!$+|.,*:]|%[a-f\d{2}])+=?(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)*)*(?:#(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)?$/i;

见demo

我还建议添加一个 /i 不区分大小写的修饰符。

使用 RegExp 构造函数的唯一优点是您可以轻松地向该表达式的块中添加注释。然后使用：

var urlValidationRegex = RegExp("^" + 
      "(?:(?:ht|f)tps?://|~?/)?" + // Protocol
      "(?:\w+:\w+@)?" +          //Username:Password
      "(?:(?:[-\w]+\.)+" +       //Subdomains
      "(?:com|org|net|gov|mil|biz|info|mobi|name|aero|jobs|museum|travel|[a-z]{2}))" +                                  //TopLevel Domains
      "(?::\d{1,5})?" +           //Port
      "(?:(?:(?:/(?:[-\w~!$+|.,=]|%[a-f\d]{2})+)+|/)+|\?|#)?" + //Directories
      "(?:(?:\?(?:[-\w~!$+|.,*:]|%[a-f\d{2}])+=?(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)(?:&(?:[-\w~!$+|.,*:]|%[a-f\d{2}])+=?(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)*)*" +                                   //Query
      "(?:#(?:[-\w~!$+|.,*:=]|%[a-f\d]{2})*)?$" //Anchor
);
document.body.innerHTML = urlValidationRegex.test("000");
document.body.innerHTML +="<br/>"+ urlValidationRegex.test("");

如何解决 Javascript 正则表达式模式中的意外量词？

How to resolve an unexpected quantifier in Javascript regex pattern?

javascript

asp.net

regex

client-side-validation

customvalidator