【JavaScript】利用正则表达式检查输入框输入的是否为网址
来源:互联网 发布:送男朋友的礼物 知乎 编辑:程序博客网 时间:2024/06/05 15:04
【JavaScript】利用正则表达式检查输入框输入的是否为网址
这个功能在网页中也是很常见的,友情链接部分、表单填写个人主页的时候,使用JavaScript取验证是否为网址。
这个检验不好写,最好还是使用正则表达式去认证。
规定,输入的东西只能是http://与https://开头,而且必须是网址。
有人说,为何像www.1.com这样的网页不行呢?
这是以免你拿用户输入的东西构造超级链接的时候,a标签中的href属性如果遇不到http://或者https://的东西,那么就会认为是根目录,会在你的网站的网址后面接着写入这个地址再跳转,这个大家应该知道。比如<a href="www.1.com">xxx</a>,我的网址是http://localhost,那么点击这个显示为xxx的a标签之后,则只是跳到http://localhost/www.1.com这个位置,当然不对了。
比如如下的文本框,如何利用正则表达式做到要求用户输入的必须是http://与https://开头的网址呢?
1、首先是一个简单的布局,这个不用说了:
2、其次是脚本,其实也不用说了,关键是那条正则表达式:
在:
之中,
1、Javascript之中,由于所有变量都是var,因此正则表达式必须写在两个斜杠之中,/.../,然后正则表达式里面的斜杠/必须写成\/
2、^表示必须以……开头,[]表示一个检验单位,也就是某个字符可以容纳的东西,比如^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/),就是要求以http://或者https://开头的意思。|是或者,第一个字符是h或者H,第二、三个字符是[tT],{2}是包括这个字符与其后面的1个字符都必须为[tT]的意思,之后以此类推
3、([A-Za-z0-9-~]+)表示,包括这个字符及其随后的字符都必须大写字母、小写字母、数字、减号-或者是~
字符+的意思是:匹配+号前面的字符1次或n次,例如:/a+/匹配"candy"中的’a’和"caaaaaaandy"中的所有'a’.
4、因此(([A-Za-z0-9-~]+)\.)+则表示XXX.这个以点结尾的东西,必须在([A-Za-z0-9-~\/])+$这个字符前面出现至少1次
5、$表示必须以大写字母、小写字母、数字、减号-、~、/结尾
这个检验不好写,最好还是使用正则表达式去认证。
规定,输入的东西只能是http://与https://开头,而且必须是网址。
有人说,为何像www.1.com这样的网页不行呢?
这是以免你拿用户输入的东西构造超级链接的时候,a标签中的href属性如果遇不到http://或者https://的东西,那么就会认为是根目录,会在你的网站的网址后面接着写入这个地址再跳转,这个大家应该知道。比如<a href="www.1.com">xxx</a>,我的网址是http://localhost,那么点击这个显示为xxx的a标签之后,则只是跳到http://localhost/www.1.com这个位置,当然不对了。
比如如下的文本框,如何利用正则表达式做到要求用户输入的必须是http://与https://开头的网址呢?
1、首先是一个简单的布局,这个不用说了:
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>无标题文档</title>
- </head>
- <body>
- 网址必须以http://或者https://开头,且必须是个网址^_^!<br />
- <input type="text" id="url" />
- <button onclick="CheckUrl()">确定</button>
- </body>
- </html>
2、其次是脚本,其实也不用说了,关键是那条正则表达式:
- <script>
- function CheckUrl(){
- var url=document.getElementById("url").value;
- var reg=/^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/;
- if(!reg.test(url)){
- alert("这网址不是以http://https://开头,或者不是网址!");
- }
- else{
- alert("输入成功");
- }
- }
- </script>
在:
- var reg=/^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/;
之中,
1、Javascript之中,由于所有变量都是var,因此正则表达式必须写在两个斜杠之中,/.../,然后正则表达式里面的斜杠/必须写成\/
2、^表示必须以……开头,[]表示一个检验单位,也就是某个字符可以容纳的东西,比如^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/),就是要求以http://或者https://开头的意思。|是或者,第一个字符是h或者H,第二、三个字符是[tT],{2}是包括这个字符与其后面的1个字符都必须为[tT]的意思,之后以此类推
3、([A-Za-z0-9-~]+)表示,包括这个字符及其随后的字符都必须大写字母、小写字母、数字、减号-或者是~
字符+的意思是:匹配+号前面的字符1次或n次,例如:/a+/匹配"candy"中的’a’和"caaaaaaandy"中的所有'a’.
4、因此(([A-Za-z0-9-~]+)\.)+则表示XXX.这个以点结尾的东西,必须在([A-Za-z0-9-~\/])+$这个字符前面出现至少1次
5、$表示必须以大写字母、小写字母、数字、减号-、~、/结尾
0 0
- 【JavaScript】利用正则表达式检查输入框输入的是否为网址
- 【JavaScript】利用正则表达式检查输入框输入的是否为网址
- js利用正则表达式检验输入内容是否为网址
- Javascript--检验输入是否为年月的正则表达式
- php正则表达式检查用户输入的格式是否正确
- 使用javascript+正则表达式判断输入是否为整数
- 利用正则表达式检查网址,手机号,邮箱是否正确(RegexKitLite)
- 判断输入是否为数字正则表达式
- JS判断输入是否为整数的正则表达式
- JS判断输入是否为整数的正则表达式
- JS判断输入是否为整数的正则表达式
- 正则表达式验证输入框是否为数字
- 正则表达式验证输入框是否为数字
- javascript利用正则表达式验证输入数据
- javascript 利用正则表达式控制 日期的输入
- 检查输入是否为中文
- 【C#】利用正则表达式判断输入是否为纯数字、容器类
- 【Java】利用正则表达式判断是否为网址
- linux取消屏保
- mysql优化大全
- Android开发:TextView实现跑马灯效果
- 数据结构 : Hash Table
- java中Class对象详解
- 【JavaScript】利用正则表达式检查输入框输入的是否为网址
- R语言视频
- Reverse Bits
- 在OpenCV2.2后的版本中没有CvvImage类的解决方法(及出现错误:IntelliSense: 未定义标识符 "CvvImage")
- 物联12:二进制树型搜索算法实例
- Mongodb简介及Spring集成
- [Point Cloud Library] 点云数据写入PCD文件
- C#Hashtable与Dictionary性能
- StackOverflowError OutOfMemoryError