<输入> URL的标签验证 [英] <input> tag validation for URL
问题描述
我正在尝试使用JavaScript验证URL,但是由于某些原因,它无法正常工作.当某人没有输入任何URL时,它显示如下消息:
I am trying to validate an URL using JavaScript, but for some reason it's not working. When someone has not entered any URL, it shows message like:
请输入有效的网址.(即http://)
Please enter valid URL.(i.e. http://)
我正在尝试修复它,但无法使其正常工作.
I am trying to fix it, but can't make it working.
HTML5中是否有任何技巧可以验证URL?
Is there any trick in HTML5 that allows to validate an URL?
$(document).ready(function() {
$("#contactInfos").validate(
{ onfocusout: false, rules: {
phone: { number:true },
zipcode: { number:true },
website: { url:true }
},
messages: { phone: { number:"please enter digit only" },
zipcode: { number:"Plese enter digit only" },
website: { url: "Please enter valid URL.(i.e. http://)" }
}
});
验证URL的方法:
url: function(value, element) {
values=value.split(',');
for (x in values)
{
temp=values[x].trim();
temp1=this.optional(element) || /^(https?|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(temp);
if(temp1!=true)
{
return false;
}
}
return true;
},
推荐答案
在html5中,您可以使用标记输入type ="url":
In html5 you can use the tag input type="url":
<input type="url" />
您也可以使用自己的模式:
you can use your own pattern too:
<input type="url" pattern="https?://.+" required />
本文中的统一资源标识符(URI):通用语法[RFC3986] http://www .ietf.org/rfc/rfc3986.txt URI的正则表达式为:
In the paper Uniform Resource Identifier (URI): Generic Syntax [RFC3986] http://www.ietf.org/rfc/rfc3986.txt the regular expression for a URI is:
^(([^:/?#]+):)?(//([^/?#]*))?([^?#]*)(\?([^#]*))?(#(.*))?
例如,将上面的表达式匹配到
For example, matching the above expression to
http://www.ics.uci.edu/pub/ietf/uri/#Related
导致以下子表达式匹配:
results in the following subexpression matches:
$1 = http:
$2 = http
$3 = //www.ics.uci.edu
$4 = www.ics.uci.edu
$5 = /pub/ietf/uri/
$6 = <undefined>
$7 = <undefined>
$8 = #Related
$9 = Related
这篇关于<输入> URL的标签验证的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!