js面向对象加构造函数模式表单验证
Posted xts6
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js面向对象加构造函数模式表单验证相关的知识，希望对你有一定的参考价值。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单验证</title>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
</head>
<body>
<div>
<input type="text" id="userName" value="6">
<input type="password" id="password">
<button id="button">提交</button>
</div>
<script>
var m=
userName:$("#userName").val(),
password:$("#password").val(),
userTest:/^[a-zA-Z]1[A-Z|a-z|0-9]5,29/,
passwordTest:/^(\w)6,20$/,//6-20个字母
test:function(testDate, testReg,testName)
this.testDate = testDate;
this.testReg = testReg;
this.testName = testName;
this.testFormData=function()
if(this.testDate==‘‘)
alert(this.testName+‘不能为空,请输入‘)
return false;
else if(!this.testReg.test(this.testDate))
alert(testName+‘格式不正确,请重新输入‘)
return false;
else
return true;
,
page:function()
alert(‘登录成功，欢迎来到百度‘)
window.location=‘https://www.baidu.com‘
,
commit:function()
this.userName=$("#userName").val();
this.password=$("#password").val();
var test=this.test;
var userNameTest=new test(this.userName,this.userTest,‘用户名‘);
var passwordTest=new test(this.password,this.passwordTest,‘密码‘);
var userNameV=userNameTest.testFormData()
console.log(userNameV)
if(!userNameV)//如果用户名不规范 就直接退出运行 不进行密码验证
return;
else
var passwordV=passwordTest.testFormData()
if(userNameV&&passwordV)
this.page();
$(‘#button‘).click(function()
m.commit()
)
</script>
</body>
</html>
以上是关于js面向对象加构造函数模式表单验证的主要内容，如果未能解决你的问题，请参考以下文章