AIDE技术官网
AIDEZY.COM

Js正则表达式注册表单验证实例

JS声明数组的四种方式

 

Js正则表达式注册表单验证实例

 

注册验证可以直接在html通过js加正则去完成,不用再后端进行验证从而消耗服务器资源。

本注册集成了:

用户名验证,电话验证,邮箱验证,密码验证,重复密码验证

 

源代码实例:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<center>
<h1>JS正则表单验证@author 无陌然</h1>
<form action="" method="get">
用户名:<p><input type="text" name="user" value=""></p>
手机号码:<p><input type="text" name="te" value=""></p>
email:<p><input type="text" name="email" value=""></p>
密码:<p><input type="password" name="password" value=""></p>
重复密码:<p><input type="password" name="repassword" value=""></p>
<p><input type="submit" value="提交" ></p>
</form>
</center>
</body>
<script type="text/javascript">

//js正则表单注册验证
//@author:无陌然
var form = document.getElementsByTagName('form')[0];
// alert(form);
form.onsubmit = function(){
//判断用户名是否合法
//示例:wuxinyue
var ins = document.getElementsByTagName('input');
// alert(ins);
var patt = /^\w{6,}$/;
if (!patt.test(ins[0].value)) {
alert('用户名不合法');
return false;
}
//判断手机号码是否合法
//示例:15223709147
var patt = /^[1]{1}[0123456789]{10}$/;
if (!patt.test(ins[1].value)) {
alert('手机号码不合法');
return false;
}
//判断邮箱是否合法
//示例:abc@cpm.com.com
var patt = /^\w+[@]{1}(\w+[\.]+[a-z0-9A-Z]+)+$/;
if (!patt.test(ins[2].value)) {
alert('邮箱不合法');
return false;
}
//密码验证
//示例:123456789
var patt = /^\w{8,20}$/;
if (!patt.test(ins[3].value)) {
alert('密码不合法');
return false;
}
//判断两次密码是否一致
//示例:123456789
if (ins[3].value != ins[4].value) {
alert('两次不一致,请重新输入');
return false;
}

}
</script>
</html>

 

 

搜一下

海报生成 赞(2) 打赏

来都来了!评论一下呗! 抢沙发

  • QQ (自动获取名称头像等信息|选填)
  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址 (选填)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

登录

忘记密码 ?

切换登录

注册