javascript注册表单验证实现

最新推荐文章于 2023-12-05 16:42:45 发布

gfdonx

最新推荐文章于 2023-12-05 16:42:45 发布

阅读量468

点赞数

分类专栏： java script

本文链接：https://blog.csdn.net/gfdonx/article/details/49586881

版权

java script 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script>


function check(){
var username = document.getElementById("username");
var userpass = document.getElementById("userpass");
var email = document.getElementById("email");
var mes = document.getElementById("mes");

var name = username.value;
var pass = userpass.value;
var mail = email.value;
var me = mes.value;

username = document.getElementById("usernames");
userpass = document.getElementById("userpasss");
email = document.getElementById("emails");
var tishi = document.getElementById("tishi");



/*判断用户名*/
if(name.length < 4 || name.length > 16){
username.innerHTML="用户名最长只能占16字符，最短4个字符，请重新填写！";
return false;
}

/*判断密码*/
if(pass.length < 6 ){
userpass.innerHTML="密码不能小于6位";
return false;
}
/*判断邮箱*/
var reg=/^\w+@\w+\.(com|cn|com\.cn|org\.cn|edu\.cn)$/;
if(!reg.test(mail)){
email.innerHTML="邮箱地址不正确";
return false;
}

/*判断个人简介*/
if(me.length == 2 ){
tishi.innerHTML="请输入个人简介";
return false;
}
return true;
}


</script>
<title>无标题文档</title>
</head>

<body>

<p><font size="+2" color="#FF0000">验证表单演示</font></p>
<form name = "form1" action="http://www.baidu.com" method="get" onSubmit="return check()">
<p>姓 名：<input type="text" name="username" size="20px" maxlength="50px" id="username"><span id="usernames" style="color:#FF0000"></span></p>
<p>密 码：<input type="password" name="userpass" size="20px" maxlength="16px" id="userpass"><span id="userpasss" style="color:#FF0000"></span></p>
<p>Email：<input type="text" name="email" size="20px" maxlength="16px" id="email"><span  id="emails" style="color:#FF0000"></span></p>
<p>性 别：<input type="radio" name = "sex" value="男" checked><img src="../image/Male.JPG" height="25" width="25">男 
<input type="radio" name="sex" value="女" ><img src="../image/Female.JPG" width="25" height="25">女 </p>
<p>爱 好：<input type="checkbox" name="interest" value="sports">运动 
<input type="checkbox" name="interest" value="talk">聊天 
<input type="checkbox" name="interest" value="playgames">玩游戏 </p>
<p>个人简介</p>
<textarea name="textarea" cols="40" rows="10" id="mes">

</textarea><span id="tishi" style="color:#FF0000"></span><br>
<input type="submit" value="提交"><input type="reset" value="重置">
</form>

</body>
</html>

gfdonx

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
javascript注册表单验证实现

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">function check(){var username = document.getElementById("username");var userpass = docume
复制链接

扫一扫

专栏目录