在 javascript/jquery 中验证 url 格式

Question

我有一个文本字段，用户必须在其中放置一个 url。我需要验证 url 格式是否有效。我需要编写一个正则表达式来查找下面的无效 url。

http://www.google.com//test/index.html //Because of double slash after host name

http:/www.google.com/test/index.html //Missing double slash for protocol

我尝试了下面的代码，它适用于第二种情况，但不适用于第一种情况

function test(url) {
    var exp=/^(https?:\/\/)?((([a-z\d]([a-z\d-]*[a-z\d])*)\.)+[a-z]{2,}|((\d{1,3}\.){3}\d{1,3}))(\:\d+)?(\/[-a-z\d%_.~+]*)*(\?[;&a-z\d%_.~+=-]*)?(\#[-a-z\d_]*)?$/;
    return exp.test(url);
}

var firstCase="http://www.google.com//test/index.html";

alert(test(firstCase));

var secondCase = "http:/www.google.com/test/index.html";

alert(test(secondCase ));

var thirdCase="http://www.google.com/test//index.html";

alert(test(thirdCase));

Answer 1

这个正则表达式解决了你的问题，“/”后面需要一个问号，表示零或其中之一，它以前与 * 元素分组，表示允许多个

function test(url) {
    var exp=/^(https?:\/\/)?((([a-z\d]([a-z\d-]*[a-z\d])*)\.)+[a-z]{2,}|((\d{1,3}\.){3}\d{1,3}))(\:\d+)?(\/?)([-a-z\d%_.~+]*)*(\?[;&a-z\d%_.~+=-]*)?(\#[-a-z\d_]*)?$/;
    return exp.test(url);
}

alert(test("http://www.google.com//bla")); //false
alert(test("http:/www.google.com/test/index.html")); //false
alert(test("http://www.google.com/bla")); //true

更具体地说：这里第一组中的斜线 (\/?)([-a-z\d%_.~+]*) 之前在第二组中，因此被允许多次