JavaScript正则表达式匹配文本字段中的URL

Question

如何设置我的正则表达式以进行测试，以查看javascript中的文本块中是否包含URL。我无法弄清楚用来完成这个的模式

 var urlpattern = new RegExp( "(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?"

 var txtfield = $('#msg').val() /*this is a textarea*/

 if ( urlpattern.test(txtfield) ){
        //do something about it
 }

编辑：

所以我现在在正则表达式测试人员中使用的模式我需要它做什么但是chrome会抛出错误

  "Invalid regular expression: /(http|ftp|https)://[w-_]+(.[w-_]+)+([w-.,@?^=%&:/~+#]*[w-@?^=%&/~+#])?/: Range out of order in character class"

代码如下：

var urlexp = new RegExp( '(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?' );

Answer 1

虽然转义破折号字符（在字符类中可以具有特殊含义作为字符范围说明符）应工作，但另一种方法是将它们的特殊含义放在开头或者类定义的结尾。

此外，字符类中的\+和\@确实被JavaScript引擎分别解释为+和@;然而，逃避不是必要的，可能会使试图在视觉上解释正则表达的人感到困惑。

我会为您的目的推荐以下正则表达式：

(http|ftp|https)://[\w-]+(\.[\w-]+)+([\w.,@?^=%&:/~+#-]*[\w@?^=%&/~+#-])?

这可以在JavaScript中指定，方法是将其传递给RegExp构造函数（就像在您的示例中所做的那样）：

var urlPattern = new RegExp("(http|ftp|https)://[\w-]+(\.[\w-]+)+([\w.,@?^=%&:/~+#-]*[\w@?^=%&/~+#-])?")

或使用//引用方法直接指定正则表达式文字：

var urlPattern = /(http|ftp|https):\/\/[\w-]+(\.[\w-]+)+([\w.,@?^=%&:\/~+#-]*[\w@?^=%&\/~+#-])?/

如果接受正则表达式作为字符串（例如，来自用户输入或AJAX调用），则必须使用RegExp构造函数，并且可能更具可读性（在本例中）。我相当确定//引用方法更有效，并且在某些时候更具可读性。两者都有效。

我在＆lt; JSFiddle＆gt;上使用Chrome测试了您的原始修改和此修改并在＆lt; {{}}＆gt;上，使用客户端正则表达式引擎（浏览器）并专门选择JavaScript。虽然第一个失败了你说的错误，我建议的修改成功。如果我从源代码中的h中删除http，则无法匹配，因为它应该匹配！

修改

如@noa在评论中所述，上述表达式与本地网络（非互联网）服务器或使用单个单词访问的任何其他服务器（例如http://localhost/ ...或{{1}）不匹配} ...）。如果需要匹配这种类型的URL（可能是也可能不是），以下可能更合适：

https://sharepoint-test-server/

＆lt; 结束修改＆gt;

最后，一个很好的资源告诉我90％关于正则表达式的知识是RegexLib.com - 我强烈推荐它，如果你想学习正则表达式（它可以做什么，不能做什么）！

Answer 2

使用new RegExp时必须使用反斜杠。

此外，您可以将短划线-放在字符类的末尾，以避免转义它。

字符类中的

&表示& or a or m or p or ;，您只需要&和;，a, m and p已经匹配\w

所以，你的正则表达式成为：

var urlexp = new RegExp( '(http|ftp|https)://[\\w-]+(\\.[\\w-]+)+([\\w-.,@?^=%&:/~+#-]*[\\w@?^=%&;/~+#-])?' );

Answer 3

这是最完整的单一URL解析模式。

它适用于任何子字符串中的任何URI / URL！

https://regex101.com/r/jO8bC4/5

示例带有输出的JS代码 - 每个URL都被转换为其“部分”的5部分数组：

var re = /([a-z]+\:\/+)([^\/\s]*)([a-z0-9\-@\^=%&;\/~\+]*)[\?]?([^ \#]*)#?([^ \#]*)/ig; 
var str = 'Bob: Hey there, have you checked https://www.facebook.com ?\n(ignore) https://github.com/justsml?tab=activity#top (ignore this too)';
var m;

while ((m = re.exec(str)) !== null) {
    if (m.index === re.lastIndex) {
        re.lastIndex++;
    }
    console.log(m);
}

会给你以下内容：

["https://www.facebook.com",
  "https://",
  "www.facebook.com",
  "",
  "",
  ""
]

["https://github.com/justsml?tab=activity#top",
  "https://",
  "github.com",
  "/justsml",
  "tab=activity",
  "top"
]

<强> BAM！ RegEx FTW！

Answer 4

尝试(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?

Answer 5

我已经清理了你的正则表达式：

var urlexp = new RegExp('(http|ftp|https)://[a-z0-9\-_]+(\.[a-z0-9\-_]+)+([a-z0-9\-\.,@\?^=%&;:/~\+#]*[a-z0-9\-@\?^=%&;/~\+#])?', 'i');

经过测试，效果很好;）

Answer 6

尝试使用此常规正则表达式以获取多种网址格式

/(([A-Za-z]{3,9})://)?([-;:&=\+\$,\w]+@{1})?(([-A-Za-z0-9]+\.)+[A-Za-z]{2,3})(:\d+)?((/[-\+~%/\.\w]+)?/?([&?][-\+=&;%@\.\w]+)?(#[\w]+)?)?/g

Answer 7

麻烦的是字符类（括号）中的“ - ”被解析为范围：[a-z]表示“a和z之间的任何字符”。正如Vini-T建议的那样，你需要使用反斜杠转义字符类中的“ - ”字符。

Answer 8

尝试这对我有用

/^((ftp|http[s]?):\/\/)?(www\.)([a-z0-9]+)\.[a-z]{2,5}(\.[a-z]{2})?$/

这是如此简单易懂