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

Question

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

 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@?^=%&/~+#-])?

这可以通过将其传递给RegExp构造函数(就像您在示例中所做的那样)在JavaScript中指定:

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

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

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

如果您将正则表达式作为字符串(例如,来自用户输入或AJAX调用)接受,则RegExp构造函数是必需的,并且可能更具可读性(在本例中).我相当肯定//引用方法更有效,并且在某些时候更具可读性.两者都有效.

我使用Chrome在< JSFiddle >和< RegexLib.com >上使用客户端正则表达式引擎(浏览器)并专门选择JavaScript 来测试您的原始和此修改.虽然第一个失败了你说的错误,我建议的修改成功.如果我h从http源中删除它,它将无法匹配,因为它应该!

编辑

正如@noa在评论中所指出的,上面的表达式将不匹配本地网络(非互联网)服务器或使用单个单词访问的任何其他服务器(例如http://localhost/......或https://sharepoint-test-server/......).如果需要匹配这种类型的URL(它可能是也可能不是),以下可能更合适:

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

#------changed----here-------------^

< 结束编辑 >

最后,一个很好的资源告诉我90%关于正则表达式的知识是Regular-Expressions.info - 我强烈推荐它,如果你想学习正则表达式(它可以做什么,不能做什么)!