表单验证

原创 2012年03月22日 14:20:45

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript"> 










function check(obj){ 
if(obj.value.length < 6 || obj.value.length > 16) { 


document.getElementById("errorinfo").style.display = "block"; 
document.getElementById("submit").disabled = true; 

  
  
  
  else { 
  
  document.getElementById("errorinfo").style.display = "none"; 
  document.getElementById("submit").disabled = false;  
  } 
  
  
    

function checkPwd(obj) 

  if (obj.value.length < 6 || obj.value.length > 16) { 
  document.getElementById("errorpwd").style.display = "block"; 
  document.getElementById("submit").disabled = true; 
  
  
  
  } 
  else { 
  
  document.getElementById("errorpwd").style.display = "none"; 
  document.getElementById("submit").disabled = false; 
  
  } 
  
    

function checkRePwd(obj) 

  var p=document.getElementById("password"); 
  if(obj.value.length<6||obj.value.length>16) 
  { 
     document.getElementById("errorrepwd1").style.display = "block"; 
      document.getElementById("submit").disabled = true; 
     
    


  } 
  if (p.value != obj.value) { 
  document.getElementById("errorrepwd2").style.display = "block"; 
  document.getElementById("submit").disabled = true; 
  
  
  
  } 
  else { 
    document.getElementById("errorrepwd1").style.display = "none"; 
  document.getElementById("errorrepwd2").style.display = "none"; 
  document.getElementById("submit").disabled = false; 
  
  } 
  
    

function checkemail(obj) 

var cEmail=obj.value; 


if(cEmail.match(/[\w-]+@{1}[\w-]+\.{1}\w{2,4}(\.{0,1}\w{2}){0,1}/ig)!=cEmail){ 
  document.getElementById("erroremail").style.display = "block"; 
   document.getElementById("submit").disabled = true; 
  
  } 
else{ 
  document.getElementById("erroremail").style.display = "none"; 
   document.getElementById("submit").disabled = false; 
  
  } 




  
    

function checkqq(obj){ 
var q=obj.value; 
var filter=/^\s*[.0-9]{5,10}\s*$/; 
    if(!filter.test(q)){ 
    document.getElementById("errorqq").style.display = "block"; 
    }else{ 
    document.getElementById("errorqq").style.display = "none"; 
    








</script> 












<link href="<%=request.getContextPath()%>/style.css" rel="stylesheet" type="text/css"> 
</head> 


<body bgcolor="#CCCCCC"  > 
<p style="color:#FF0000" align="center">温馨提示:带&quot;*&quot;为必填内容</p> 


<form name="form1" method="post" action="servlet/RegisterServlet" > 
  <table width="41%" height="300" border="0" align="center" cellpadding="1" cellspacing="1" bordercolor="#FFFFFF" bgcolor="#FFFFFF"> 
    <tr bgcolor="#FFFFFF"> 
      <td height="27" colspan="2" align="center" background="images/table.gif"><strong><font color="#FFFFFF">欢迎加入</font></strong></td> 
    </tr> 
    <tr bgcolor="#FFFFFF"> 
      <td width="19%" height="27" align="center">账号:</td> 
      <td width="81%" height="27"><input name="username" type="text" id="username" onblur="check(this)"/> 
     * <div style="display:none" id="errorinfo">账号长度必须在6至16个字符之间</div></td> 
     
    </tr> 
    <tr bgcolor="#FFFFFF"> 
      <td width="19%" height="27" align="center">密码:</td> 
      <td width="81%" height="27"><input name="password" type="password" id="password" onblur="checkPwd(this)"/> 
     * <div style="display:none" id="errorpwd">密码长度必须在6至16个字符之间</div></td> 
    </tr> 
    <tr bgcolor="#FFFFFF"> 
      <td width="19%" height="27" align="center">再次输入密码:</td> 
      <td width="81%" height="27"><input name="rePassword" type="password" id="rePassword" onblur="checkRePwd(this)" /> 
     * 
      <div style="display:none" id="errorrepwd1">两次输入密码不一致</div> 
      <div style="display:none" id="errorrepwd2">密码长度必须在6至16个字符之间</div></td> 
    </tr> 
    <tr bgcolor="#FFFFFF"> 
      <td height="27" align="center">性别:</td> 
      <td height="27"><select name="sex" id="sex"> 
          <option value="男" selected>男</option> 
          <option value="女">女</option> 
        </select></td> 
    </tr> 
    <tr bgcolor="#FFFFFF"> 
      <td height="27" align="center">邮件:</td> 
      <td height="27"><input name="email" type="text" id="email" onblur="checkemail(this)"/>* 
<div style="display:none" id="erroremail">输入邮箱格式有误</div></td> 


    </tr> 
   
    <tr bgcolor="#FFFFFF"> 
      <td height="31" align="center">QQ:</td> 
      <td height="31"><input name="qq" type="text" id="qq" onblur="checkqq(this)" /> 
     


      <div style="display:none" id="errorqq">请输入正确的qq</div></td> 
    </tr> 
    <tr bgcolor="#FFFFFF"> 
      <td height="31" align="center">头象:</td> 
      <td height="31"><input name="tx" type="radio" value="images/face01.gif" checked> 
        <img src="<%=basePath%>images/face01.gif" width="32" height="32"> 
        <input type="radio" name="tx" value="images/face02.gif"> 
        <img src="<%=basePath%>images/face02.gif" width="32" height="32"> 
        <input type="radio" name="tx" value="images/face03.gif"> 
        <img src="<%=basePath%>images/face03.gif" width="32" height="32"> <br> 
        <input type="radio" name="tx" value="images/face04.gif"> 
        <img src="<%=basePath%>images/face04.gif" width="32" height="32"> 
        <input type="radio" name="tx" value="images/face05.gif"> 
        <img src="<%=basePath%>images/face05.gif" width="32" height="32"> 
        <input type="radio" name="tx" value="images/face06.gif"> 
        <img src="<%=basePath%>images/face06.gif" width="32" height="32"></td> 
    </tr> 
    
    <tr bgcolor="#FFFFFF"> 
    
      <td height="31" colspan="2" align="center"> 
       <input type="submit" value="提交"  id="submit" style="width:50px" disabled="disabled"/>    &nbsp;&nbsp; 
  <input style="width:50px;" type="reset" value="重置"/>&nbsp;&nbsp; 
  <input style="width:50px;" type="button" value="返回" onClick="window.location.href='http://localhost:8080/lastuse/servlet/QueryServlet'"> 
      </td> 
    </tr> 
  </table> 
</form>


相关文章推荐

ThinkPHP-2-链接mysql+表单验证

  • 2017年07月16日 14:12
  • 2MB
  • 下载

强大的表单验证库

  • 2014年11月10日 17:37
  • 5.52MB
  • 下载

表单验证后提交 两种方式 2016/07/10

————————————————前面比较啰嗦,具体方法在最后———————————— 今天使用ajax,在增加用户,点击保存后,先不提交,先判断填写的信息,然后确定是否提交。 这是做的第一个练手的...

很好用的表单验证

  • 2017年02月06日 10:07
  • 5KB
  • 下载

极漂亮的表单验证小弹框

  • 2016年01月13日 13:56
  • 7KB
  • 下载

bootstrap表单验证插件 经验记录 与RSA加密事件配合修改

继大概只有自己能懂的干货 注册表单密码RSA加密 再续写表单验证。因为项目用的是bootstrap,所以就将就到底,直接用bootstrapvalidate 插件了。 两个插件文件引进来先,可以在官...
  • chanzig
  • chanzig
  • 2015年03月05日 21:35
  • 3509

js表单验证类2015

  • 2015年10月22日 14:00
  • 26KB
  • 下载

表单验证方法

  • 2015年07月29日 09:05
  • 145KB
  • 下载

layui 表单验证案例

文本框,手机,邮箱,textarea等格式的验证     HTML代码: ...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:表单验证
举报原因:
原因补充:

(最多只允许输入30个字)