Javascript 笔记与总结(2-18)正则验证与正则匹配
① 判断 String 是否符合正则要求
patt.test(String);
【例】表单提交:
a.用户名不能为空,只能是数字及字母,6-11位
b.email 不能为空且格式正确
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
table{
width:400px;
height:400px;
border:0;
border-collapse: collapse;
background:orange;
} td{
border: 1px solid gray;
cursor:pointer;
}
</style>
</head>
<body>
<form action="">
<p>用户名:<input type="text" name="username" id=""></p>
<p>Email:<input type="text" name="email" id=""></p>
<p><input type="submit" value="提交"></p>
</form>
</body>
<script>
document.getElementsByTagName("form")[0].onsubmit = function(){
var patt = /^[a-zA-Z0-9]{6,11}$/;
if(!patt.test(document.getElementsByName("username")[0].value)){
alert("用户名只能是6-11位数字及字母组成");
return false;
} patt = /^[a-zA-Z0-9\.-]+@\w+(\.\w+)+$/; //域名不能有_,可以有-
if(!patt.test(document.getElementsByName("email")[0].value)){
alert("邮箱错误");
return false;
}
}
</script>
</html>
注意:js 正则表达式 // 外面不要加单引号,这点与 php 不同。
② 找出字符串中符合正则的子串
patt.exec(String);
【例】查出含有邮箱的人,给这些人的名字标红
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
table{
width:400px;
height:400px;
border:0;
border-collapse: collapse;
background:orange;
} td{
border: 1px solid gray;
cursor:pointer;
}
</style>
</head>
<body>
<input type="button" value="标红有邮箱的人">
<ul>
<li>袁绍</li>
<li>曹操</li>
<li>孙坚<sunjian@changsha.com></li>
<li>董卓<dongzhuo@xiliang.com></li>
</ul>
</body>
<script>
function find(){
var lis = document.getElementsByTagName("li");
var i = 0;
var patt = /[a-zA-Z0-9\.-]+@\w+(\.\w+)+/;
while(i < lis.length){
if(null !== patt.exec(lis[i].innerHTML)){ //exec 匹配到值时返回匹配到的值,否则返回null
lis[i].style.color = "red";
}
i += 1; //建议使用 i += 1 代替 i ++
}
} document.getElementsByTagName("input")[0].onclick = find;
</script>
</html>
Javascript 笔记与总结(2-18)正则验证与正则匹配的更多相关文章
- 9月26日JavaScript表单验证、正则表达
一.非空验证 trim:去空格(去掉前后的空格),任何字符串都可以用这个方法.写法为:if(v.trim().length==0),表示如果去掉空格后的字符串的长度为0. <body> & ...
- JavaScript正则验证邮箱
正则表达式/^正则$/.test() <html> <head> <title>JavaScript</title> <meta charset= ...
- [javascript] test() 方法进行正则验证
test() 方法用于检测一个字符串是否匹配某个模式 最近遇到的某业务中进行发票抬头的正则验证如下: console.log(/^[a-zA-Z\u4e00-\u9fa5\s()()<>& ...
- js正则表达式实现手机号码,密码正则验证
手机号码,密码正则验证. 分享下javascript中正则表达式进行的格式验证,常用的有手机号码,密码等. /** * 手机号码 * 移动:134[0-8],135,136,137,138,139,1 ...
- 正则表达式控制Input输入内容 ,js正则验证方法大全
https://blog.csdn.net/xushichang/article/details/4041507 //输入姓名的正则校验 e.currentTarget.value = e.curre ...
- js正则验证数字的方法
正则验证数字的方法: <script type="text/javascript"> function validate(){ var reg = new RegExp ...
- Javascript正则构造函数与正则表达字面量&&常用正则表达式
本文不讨论正则表达式入门,即如何使用正则匹配.讨论的是两种创建正则表达式的优劣和一些细节,最后给出一些常用正则匹配表达式. Javascript中的正则表达式也是对象,我们可以使用两种方法创建正则表达 ...
- TP框架自带的正则验证的规则(转载)
thinkphp框架里面自带有很多自动验证的规则,下面是框架自带的正则验证的规则,官方的说明文档里面没有这么多,所以记下来,以备使用. view sourceprint?01static $regex ...
- 手机号码js正则验证
手机号码js正则验证 var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/; if (!myreg.test($(" ...
随机推荐
- 【转】Quartus II调用modelsim无缝仿真
Quartus II调用modelsim无缝仿真 ★emouse 思·睿博客文章★ 原创文章转载请注明:http://emouse.cnblogs.com 本篇文章为转载,写的不错,最近在学mode ...
- Android_adb shell am/pm使用
转自:http://blog.sina.com.cn/s/blog_51335a0001017ux5.html adb shell am instrument [options] <COMP ...
- 微博feed系统的推(push)模式和拉(pull)模式和时间分区拉模式架构探讨
sns系统,微博系统都应用到了feed(每条微博或者sns里的新鲜事等我们称作feed)系统,不管是twitter.com或者国内的新浪微博,人人网等,在各种技术社区,技术大会上都在分享自己的feed ...
- freopen()——重定向标准输入输出流
freopen()——重定向标准输入输出流 头文件:stdio.h 函数原型:FILE * freopen(const char *filename , const char *type , FIL ...
- hdu 4393 优先队列
用优先队列储存每个人的初始距离和编号,每轮求出最快的人,然后pop掉 一开始想遍历队列的,后来发现队列没办法遍历,汗-_-! 题意,给几个第一秒冲出的距离和以后速度,求每秒后最前面人的编号,求完后最前 ...
- css实现三角形图标
css边框和相框构造是一样的,看下面这代css代码: <div style="border-color: red blue black green;border-style: soli ...
- 获取表信息(MSSQL)
涉及到的系统表汇总 sys.databases sys.objects sys.indexes sys.tables sys.columns sys.data_spaces sys.partition ...
- CDH中flume是已经启动着了…
文章来自:http://www.cnblogs.com/hark0623/p/4174646.html 转发请注明 在CDH中用了几天flume后才发现,原来CDH中的flume默认是启动的……… ...
- Visual studio 中或IIS中使用Less预处理语言
在用css预编译语言less时,在visual studio中编写静态页时报错,错误如下: 原因: 经过一番搜索后终于找到解决办法,原来是 visual studio中绑定的IIS Express没有 ...
- WPF 碰撞检测
have tested this, it worked, at least for me var x1 = Canvas.GetLeft(e1); var y1 = Canvas.GetTop(e1) ...