使用jQueryvalidationurl而无需validation插件？

我需要使用jQueryvalidationvariables中的url，但不能使用validate-plugin。 有一个简单的方法来做到这一点？

Answer 1

你可以使用与validation插件相同的正则expression式（在2015年5月23日更新到最新的正则expression式）：

function isUrlValid(url) { return /^(https?|s?ftp):\/\/(((([az]|\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]))|((([az]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([az]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([az]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([az]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([az]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([az]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([az]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([az]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([az]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([az]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([az]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(#((([az]|\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> 

Answer 2

非常感谢Meo和Nick，我把你的答案放在一起，它的工作非常好。

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

Answer 3

如果您确定受众群体正在使用HTML5，则可以使用type="url"来validation文本string。 您也可以dynamic创build一个input元素，设置types并testingvariables是否是有效的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')); 

Answer 4

是与正则expression式：

 /^(http|https|ftp):\/\/[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[az]{2,5}(:[0-9]{1,5})?(\/.*)?$/ix 

Answer 5

 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'); } 

Answer 6

代码：

 var re = /^(https?:\/\/(?:www\.|(?!www))[^\s\.]+\.[^\s]{2,}|www\.[^\s]+\.[^\s]{2,})/; re.test('http://www.goole.in'); 

Answer 7

你想validation你的url：

请在这个函数中传递URL，然后这会给你真或假 。

参见function：

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