Проверка URL с помощью jQuery без плагина validate?

Мне нужно проверить URL-адрес в переменной с помощью jQuery, но не могу использовать плагин validate. Есть ли простой способ сделать это?

Источник

7 ответов

Решение

Вы можете использовать то же регулярное выражение, что и плагин проверки (обновлено до последнего регулярного выражения 23 мая 2015 г.):

function isUrlValid(url) {
    return /^(https?|s?ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(url);
}

var testCases = [
    "http://www.google.com/",
    "https://www.google.com/",
    "ftp://www.google.com/",
    "http://google.com/",
    "http://google.com",
    "https://google.com",
    "http://www.google.com:80/",
    "https://www.google.com:443/",
    "http://127.0.0.1/",
    "http://127.0.0.1:9200/",
    "www.site.com",
    "x:",
    "http://",
    "javascript:alert('xss')",
    "http://w",
    "http:",
    "derp://www.google.com",
    "http://localserver"
],  div = document.getElementById("output");

for(var i=0; i < testCases.length; i++) {
    var test = testCases[i];
    div.innerHTML += (isUrlValid(test) ? "<span class='valid'>valid</span>:   " : "<span class='invalid'>invalid</span>: ") + "" + test + "\n";
}
.valid { color: green; }
.invalid { color: red; }
<pre id="output"></pre>

Это обрабатывает Unicode и т. Д., Так что это немного многословно. Источник - сам плагин проверки. Несколько замечаний: это, вероятно, то, что вы хотите, но это не совсем правильно. Как правило, вам нужно выбрать несколько другое регулярное выражение, если вы хотите принять такие вещи, как http://w а также http://localserver которые действительны в среде интрасети, но обычно не допускаются в большинстве веб-форм. В каком-то смысле это регулярное выражение безопаснее, поскольку в таких случаях требуется полное доменное имя. Точно так же другие примеры, такие как пользовательские протоколы, здесь отклонены, но они действительны и работают для многих вещей, используемых сегодня. Если вы спрашиваете пользователей "какова ваша домашняя страница?" в форме, хотя... вы, вероятно, хотите исключить их в любом случае.

Любой, кто обнаружит это позже: пожалуйста, не стесняйтесь тестировать дополнительные тестовые примеры с помощью фрагмента, который я включил, и обновите ответ, если вы считаете, что следует упомянуть новый общий случай. Я переписал ответ с последним регулярным выражением и в этом формате, чтобы лучше служить сообществу.

Источник

Большое спасибо, Мео и Ник, я соединила оба твоих ответа, и это прекрасно работает.

if(/^(http|https|ftp):\/\/[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$/i.test($("#url").val())){
    alert("valid URL");
} else {
    alert("invalid URL");
}
Источник

Если вы уверены, что ваша аудитория использует HTML5, вы можете использовать type="url" проверить текстовую строку. Вы также можете динамически создать элемент ввода, установить тип и проверить, является ли переменная действительным URL-адресом или нет.

Следующее основано на сообщении в блоге от https://www.raymondcamden.com/2016/10/19/using-html-form-validation-in-pure-javascript

var elm;
function isValidURL(u){
  if(!elm){
    elm = document.createElement('input');
    elm.setAttribute('type', 'url');
  }
  elm.value = u;
  return elm.validity.valid;
}

console.log(isValidURL('http://www.google.com/'));
console.log(isValidURL('//google.com'));
console.log(isValidURL('google.com'));

Источник 
var url = $('input.surl').val();
url_validate = /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/;
if(!url_validate.test(url)){
   alert('error');
}
else{
   alert('success');
}
Источник

Да с регулярным выражением:

/^(http|https|ftp):\/\/[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$/ix
Источник

Код:

var re = /^(https?:\/\/(?:www\.|(?!www))[^\s\.]+\.[^\s]{2,}|www\.[^\s]+\.[^\s]{2,})/;
re.test('http://www.goole.in');
Источник

Вы хотите подтвердить свой URL:

Пожалуйста, передайте URL в этой функции, тогда это даст вам истинное ИЛИ ложное.

Смотрите функцию:

<script>
function isUrl(s) {
    var regexp = /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/
    return regexp.test(s);
}

isUrl(yourURL);
</script>
Источник
Другие вопросы по тегам