javaScript--简单表单验证
程序员文章站
2022-07-15 16:51:50
...
javaScript–简单表单验证
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>表单验证</title>
<script type="text/javascript">
var usernameFlag=false;
var pwdFlag=false;
var sp=document.getElementsByTagName("span");
function judgeUser(){
var username2=document.lementsByName("username");
var str=username2[0].value;
// alert(str)
if(str.length<6){
sp[0].innerHTML="<font style='color: red'>用户名长度小于6位</font>"
}else{
usernameFlag=true;
sp[0].innerHTML="<font style='color: green'>可以使用</font>"
}
}
function judgePwd(){
var pwd=document.getElementsByName("pwd");
var str= pwd[0].value;
// alert(str)
if(str.length<6){
sp[1].innerHTML="<font style='color: red'>密码长度小于6位</font>"
}else {
pwdFlag=true;
// sp[0].innerHTML="<font>登录成功</font>"
}
}
//注册
function zhuCe(){
if(pwdFlag==true && usernameFlag==true){
alert("注册成功！");
}else{
alert("注册失败，请刷新重试");
}
}
</script>
</head>
<body>
用户名：<input type="text" name="username" onchange="judgeUser()"/><span></span><br/>
密码:<input type="password" name="pwd" onchange="judgePwd()"/><span></span><br/>
<input type="button" value="注册" onclick="zhuCe()">
</body>
</html>