//及时验证用户名
function checkuse(){
//在每个函数中定义check变量是为了在表单提交后,能够逐个验证每个函数是否通过,很好很好。(以下同理)
var check;
var username = document.getElementById("username").value;
if (username.length > 18 || username.length <6) {
alert("用户名输入不合法,请重新输入!");
//此处甚妙,既然你在此处输入错误,那么按理说当然要在此处继续输入了。(在此处继续获取焦点!)
document.getElementById("username").focus();
check =false;
} else {
document.getElementById("checktext1").innerHTML ="* 用户名由6-18位字符组成 √";
check =true;
}
return check;
}
//利用正则表达式判断密码符合否
function checkpwd() {
var check;
var reg = /[^A-Za-z0-9_]+/;
var regs = /^[a-zA-Z0-9_\u4e00-\u9fa5] + $ /;
varpassword =document.getElementById("password").value;
if (password.length < 6 || password.length > 18 || regs.test(password)) {
alert("密码输入不合法,请重新输入!");
document.getElementById("password").focus();
check = false;
} else {
document.getElementById("checktext2").innerHTML = "* 密码由6-18位字符组成,且必须包含字母、数字和标点符号 √";
check = true;
}
return check;
}
//验证密码是否不一致!
function checkpwdc() {
var check;
var password = document.getElementById("password").value;
var pwdc = document.getElementById("pwdc").value;
if (password != pwdc) {
alert("两次输入密码不一致,请重新输入!");
document.getElementById("pwdc").focus();
check = false;
} else {
document.getElementById("checktext3").innerHTML = "* 请再次输入你的密码 √";
check = true;
}
return check;
}
//提交时验证用户类别
function checkut(){
var check;
if(document.getElementById("selUser").selectedIndex == 0)
{
alert("请选择用户类型!");
document.getElementById("selUser").focus();
check = false;
}else{
document.getElementById("checktext4").innerHTML = "* 请选择用户类型 √";
check = true;
}
return check;
}
//提交时验证用户性别
function checkGender(){
var check;
var gender = "";
//获取所有名称为sex的标签
var sex = document.getElementsByName("sex");
//遍历这些名称为sex的标签
for(var i=0;i
//如果某个sex被选中,则记录
if(sex[i].checked)
gender =sex[i].value;
}
if(gender == "")
{
alert("请选择性别!");
check =false;
}else{
document.getElementById("checktext5").innerHTML ="* 请选择你的性别 √";
check =true;
}
return check;
}
//及时验证出生日期
function checkDate(){
var check;
if(document.getElementById("txtDate").value ==""){
alert("请填写出生日期!");
document.getElementById("txtDate").focus();
check =false;
}else{
document.getElementById("checktext6").innerHTML ="* 请选择你的出生日期 √";
check =true;
}
return check;
}
//及时验证兴趣爱好
function checkHobby(){
var check;
varhobby =0;
//objNum为所有名称为hobby的input标签
varobjNum =document.getElementsByName("hobby");
//遍历所有hobby标签
for(vari=0;i
//判断某个hobby标签是否被选中
if(objNum[i].checked==true)
hobby++;
}
//如果有选中的hobby标签
if(hobby >=1){
document.getElementById("checktext7").innerHTML = "* 请选择你的兴趣爱好 √";
check = true;
}else{
alert("请填写爱好!");
check = false;
}
return check;
}
//正则表达式验证电子邮件(及时)
function checkemail(){
var check;
//电子邮件的正则表达式
var e1 = document.getElementById("email").value.indexOf("@",0);
var e2 = document.getElementById("email").value.indexOf(".",0);
if(email == "" || (e1==-1 || e2==-1) || e2
{
alert("E_mail输入错误!");
document.getElementById("email").focus();
check =false;
} else {
document.getElementById("checktext8").innerHTML ="* 请填写常用的EMAIL,将用于密码找回 √";
check =true;
}
return check;
}
//及时验证自我介绍
function checkintro(){
var check;
varintro =document.getElementById("introduction").value;
if (intro.length > 100) {
alert("字数超限!");
check = false;
} else {
document.getElementById("checktext9").innerHTML = "* 限100字内 √";
document.getElementById("checktext9").focus();
check = true;
}
return check;
}
//提交表单时所有都验证一遍(若任何一个验证不通过,则返回为false,阻止表单提交)
function check() {
var check = checkuse() && checkpwd() && checkpwdc() && checkut() && checkGender() && checkDate() && checkHobby()
&& checkemail() &&checkintro();
return check;
}
表单及时验证小例子
用户名: | * 用户名由6-18位字符组成 | |
密码: | * 密码由6-18位字符组成,且必须包含字母、数字和标点符号 | |
确认密码: | * 请再次输入你的密码 | |
用户类型: | 请选择 管理员 普通用户 | * 请选择用户类型 |
性别: | 男 女 | * 请选择你的性别 |
出生日期: | * 请选择你的出生日期 | |
兴趣爱好: | 阅读 音乐 运动 | * 请选择你的兴趣爱好 |
电子邮件: | * 请填写常用的EMAIL,将用于密码找回 | |
自我介绍: | 这是自我介绍... | * 限100字内 |