请各位大侠帮忙！关于js验证的问题

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>用户注册 </title>
 <style>
body {margin:0;padding:0;font-size:14px;}
#container{margin:auto;height:auto;}
#reg_fm{ margin:auto; width:600px; height:auto; padding:10px;}
#reg_tb {padding:10px 0;vertical-align:middle;line-height:normal;}
#reg_tb .lb {white-space:nowrap; width:100px; text-align:right; display:inline;}
#reg_tb .gray{ padding-left:80px;font-size:12px;color:#666; height:25px; line-height:25px; margin:5px auto;}
#reg_tb input.lt{padding:1px;height:18px;width:150px;}
#reg_tb input.pa{padding:1px;height:18px;width:150px;}
#reg_tb input.ma{padding:1px;height:18px;width:250px;}
#reg_tb input.v{padding:1px;height:18px;}
#reg_check{line-height:130%}
#reg_v_tr{}
#reg_v_img{border:1px solid #000;}
#reg_tb a.la{font-size:13px;color:#03c}
#reg_submit{width:145px;height:28px;font-size:14px; display:block; margin-top:10px; margin-bottom:5px;}
#reg_note{width:470px;height:85px;background:#ebebe4;color:#666;font-size:13px;border:1px solid #7f9db9;overflow-y:scroll}
.hint{
 font:"华文楷体", "华文宋体", "宋体";
 font-size:12px;
 color:#F00;
 position:relative;
 padding:0px 5px;
 margin:-2px 0px 0px 0px;
 width:auto;
 height:auto;
 display:inline;
}
.hint1{
 font:normal 11px/14px verdana;
     color:#F00;
     width:120px;
     height:25px;
     background-image:url(gou.png);
     margin:auto;
     display:inline;
}
  </style>
  <script language="javascript">
/*验证用户名*/
function checkname(){
var div=document.getElementById("div1");
div.innerHTML="";
var name1=document.form1.reg_u.value;
if(name1==""){
div.innerHTML="姓名不能为空！";
return false;
}
if(name1.length<4||name1.length >16){
div.innerHTML="请输入的长度4-16个字符！";
return false;
}
var charname1=name1.toLowerCase();
for (var i=0;i<name1.length;i++){
var charname=charname1.charAt(i);
if (!(charname>=0&&charname<=9)&&(!(charname >='a'&&charname<='z'))&&(charname!='_')){
div.innerHTML="用户名包含非法字母，只能包含字母，数字，和下划线";
return false;
}
}
document.getElementById("div1").className="hint1";
return true;
}
  /*验证密码*/
function checkpassword(){
var div=document.getElementById("div2");
div.innerHTML="";
var password=document.form1.reg_p.value;
if (password=="") {
div.innerHTML="密码不位空！";return false;
}
if(password.length<6||password.length>16){
div.innerHTML="请将密码长度设置为6-16位";
return false;
}
document.getElementById("div2").className="hint1";
return true;
}
  /*验证确认密码*/
function checkrepassword(){
var div=document.getElementById("div3");
div.innerHTML="";
var password=document.form1.reg_p.value;
var repass=document.form1.reg_p2.value;
if(repass=="") {
div.innerHTML="确认密码不位空！";
return false;
}
if(password!=repass) {
div.innerHTML="输入密码和确认密码不一致";
return false;
}
document.getElementById("div3").className="hint1";
return true;
}
  /*验证邮箱*/
function checkEmail(){
var div=document.getElementById("div4");
div.innerHTML="";
var email=document.form1.reg_m.value;
var sw =email.indexOf("@",0);
var sw1=email.indexOf(".",0);
var tt=sw1-sw;
if(email.length==0) {
div.innerHTML="电子邮件不能位空";
return false;
}
if(email.indexOf("@",0)==-1){
div.innerHTML="电子邮件格式不正确，必须包含@符号";
return false;
}
if(email.indexOf(".",0)==-1){
div.innerHTML="电子邮件格式不正确，必须包含.符号";
return false;
}
if(tt==1){
div.innerHTML="邮件格式不对。@和.不可以挨着！";
return false;
}
if(sw>sw1) {
div.innerHTML="电子邮件格式不正确，@符号必须在.之前";
return false;
}
else {
return true;
}
document.getElementById("div4").className="hint1";
return true;
}
/*验证全部*/
function check(){
if(checkname()&&checkpassword()&&checkrepassword()&&checkEmail()){
return true;
}
else {
return false;
}
}
</script>
</head> <body>
 <div id="container"> 
   <form  name="form1" method="post" id="reg_fm" action="#"  onsubmit="check()" target=reg_Hide_Frame> 
    <div id="reg_tb" cellpadding=0 cellspacing=0 border="0"> 
    
        <div class="lb">用 户 名 ：</div>
        <input class="lt" type="text" id="reg_u" onkeyup="checkname()">
         <div class="hint" id="div1"></div>
        <div class="gray">请输入4~16个字节（数字，字母和下划线）</div> 
       
       <div class="lb">设置密码：</div> 
       <input class="pa" type="password" id="reg_p" onkeyup="checkpassword()">
       <div class="hint" id="div2"></div>
       <div class=gray>密码长度6～16位，字母区分大小写。</div>
  
       <div class="lb">确认密码：</div> 
       <input class="pa" type="password" id="reg_p2" onkeyup="checkrepassword()">
       <div class="hint" id="div3"></div>
       <div class=gray>请输入相同密码！</div>
   
       <div class="lb">性　　别：</div> 
       <input name="sex" type="radio" id="reg_sex_m" value="1" checked>
       <label for="reg_sex_m">男</label> 
       <input name="sex" type="radio" id="reg_sex_f" value="2">
       <label for=reg_sex_f>女</label>
       <div class=gray>注册过后不能更改！</div>
       
        <div class="lb">电子邮件：</div>
        <input class="ma" type="text" id="reg_m" onkeyup="checkEmail()">
        <div class="hint" id="div4"></div> 
        <div class=gray>请输入有效的邮件地址，当密码遗失时凭此领取</div> 
   
        <div class="lb">验 证 码：</div> 
        <input id="reg_v" class="v" type="text" size="4"> 
        <img style='margin:0 10px' align="middle" id="reg_v_img" src='about:blank'> </td> 
        <a id="reg_v_re" class="la" href="#" >看不清？</a> 
        <div class="hint" id="div5"></div>
      
         <input type="submit" id="reg_submit" value="同意以下协议并提交">
         <textarea id="reg_note">
         </textarea>         
      </div> 
    </form>
   </div>
   <div>
      <iframe style='display:none' src='about:blank' id=reg_Hide_Frame name=reg_Hide_Frame></iframe>
   </div>
   </body> </html>
以上是源码部分，已验证用户名为例，验证成功后，没有显示我重新设置的“hint1”这个类所设置的格式，而重新删除输入信息后，原本在验证成功后的样式也显示出来，请问，这是什么问题啊？

解决方案 »

  1.   

    onsubmit="return check()"
      

  2.   

    看LZ的验证代码 都是上来先 div.innerHTML=""; 验证成功后再document.getElementById("div1").className = "hint1"; 
    也就是说 不合法的情况下代码没问题 但验证通过时 因为你已经div.innerHTML=""; 所以 你再加样式 完全看不出来的 
    再者 确认下.hint1{
    font:normal 11px/14px verdana;
      color:#F00;
      width:120px;
      height:25px;
      background-image:url(gou.png);
      margin:auto;
      display:inline;
    }中图片的路径是否正确
      

  3.   

     
    对于toury的回答，我试了下，依然不行啊！再就是fanchuanzhidu，
    图片路径没错，因为同样的代码我用另外一个页面写就能显示正确效果，但是重新删除输入内容后还是发生效果重叠，怎样解决呢？
      

  4.   


    /*验证用户名*/
    function checkname(){
      var div=document.getElementById("div1");
      div.className="hint";//只要改变内容就复原样式为hint
      div.innerHTML="";
      var name1=document.form1.reg_u.value;
      if(name1==""){
        div.innerHTML="姓名不能为空！";
        return false;
      }
      else if(name1.length<4||name1.length >16){
        div.innerHTML="请输入的长度4-16个字符！";
        return false;
      }
      else{
        var charname1=name1.toLowerCase();
        for (var i=0;i<name1.length;i++){
          var charname=charname1.charAt(i);
          if (!(charname>=0&&charname<=9)&&(!(charname >='a'&&charname<='z'))&&(charname!='_')){
            div.innerHTML="用户名包含非法字母，只能包含字母，数字，和下划线";
            return false;
          }
        }
      }
      div.className="hint1";//只要通过验证就改变样式为hint1
      return true;
    }
      

  5.   

    这下删除输入内容后显示正常了，但是当用户名注册成功后，还是没能正确显示gou.jpg这张图片，也就是hint1的样式啊，另外再问一个问题，我把原来的代码稍微改了下，加了验证码，但是不知道怎么用js获得shengcheng.asp这个文件产生的验证码，只能获得输入的验证码，源码如下：
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>用户注册 </title>
     <style>
    body {margin:0;padding:0;font-size:14px;}
    #container{margin:auto;height:auto;}
    #reg_fm{ margin:auto; width:600px; height:auto; padding:10px;}
    #reg_tb {padding:10px 0;vertical-align:middle;line-height:normal;}
    #reg_tb .lb {white-space:nowrap; width:100px; text-align:right; display:inline;}
    #reg_tb .gray{ padding-left:80px;font-size:12px;color:#666; height:25px; line-height:25px; margin:5px auto;}
    #reg_tb input.lt{padding:1px;height:18px;width:150px;}
    #reg_tb input.pa{padding:1px;height:18px;width:150px;}
    #reg_tb input.ma{padding:1px;height:18px;width:250px;}
    #reg_tb input.v{padding:1px;height:18px;}
    #reg_check{line-height:130%}
    #reg_v_tr{}
    #reg_v_img{border:1px solid #000;padding:0px;height:18px;}
    #reg_tb a.la{font-size:13px;color:#03c}
    #reg_submit{width:145px;height:28px;font-size:14px; display:block; margin-top:10px; margin-bottom:5px; display:inline;}
    #reg_reset{width:60px;height:28px;font-size:14px; display:block; margin-top:10px; margin-bottom:5px; display:inline;}
    #reg_note{width:470px;height:85px;background:#ebebe4;color:#666;font-size:13px;border:1px solid #7f9db9;overflow-y:scroll}
    .hint{
     font:"华文楷体", "华文宋体", "宋体";
     font-size:12px;
     color:#F00;
     position:relative;
     padding:0px 5px;
     margin:-2px 0px 0px 0px;
     width:auto;
     height:auto;
     display:inline;
    }
    .hint1{
     font:normal 11px/14px verdana;
         color:#F00;
         width:120px;
         height:25px;
         background-image:url(file:///C|/Users/laonon/Desktop/js%E9%AA%8C%E8%AF%81/gou.png);
         margin:auto;
         display:inline;
    }
      </style>
      <script language="javascript">
       
    /*验证用户名*/
    function checkname(){
    var div=document.getElementById("div1");
    div.innerHTML="";
    var name1=document.form1.reg_u.value;
    if(name1==""){
    div.innerHTML="姓名不能为空！";
    return false;
    }
    if(name1.length<4||name1.length >16){
    div.innerHTML="请输入的长度4-16个字符！";
    return false;
    }
    var charname1=name1.toLowerCase();
    for (var i=0;i<name1.length;i++){
    var charname=charname1.charAt(i);
    if (!(charname>=0&&charname<=9)&&(!(charname >='a'&&charname<='z'))&&(charname!='_')){
    div.innerHTML="用户名包含非法字母，只能包含字母，数字，和下划线";
    return false;
    }
    }
    /*document.getElementById("div1").className="hint1";*/
    div.innerHTML='<font color="#32CD32">用户名符合要求！</font>'
    return true;
    }
      
      /*验证密码*/
    function checkpassword(){
    var div=document.getElementById("div2");
    div.innerHTML="";
    var password=document.form1.reg_p.value;if (password=="") {
    div.innerHTML="密码不位空！";
    return false;
    }var charpsw1=password.toLowerCase();
    for (var i=0;i<password.length;i++){
    var charpsw=charpsw1.charAt(i);
    if (!(charpsw>=0&&charpsw<=9)&&(!(charpsw>='a'&&charpsw<='z'))){
    div.innerHTML="密码包含非法字母，只能包含字母，数字！";
    return false;
    }
    }if(password.length<6||password.length>16){
    div.innerHTML="请将密码长度设置为6-16位！";
    return false;
    }if(password.length>=6&&password.length<12){
    div.innerHTML='<font color="#32CD32">密码符合要求。密码强度：弱!</font>';
    return true;
    }
    if(password.length>=12&&password.length<=16&&(password.match(/[0-9]{12,16}/)!=null||password.match(/[a-zA-Z]{12,16}/)!=null)){
    div.innerHTML='<font color="#32CD32">密码符合要求。密码强度：中!</font>';
    return true;
    }
    if(password.length>=12&&password.length<=16&&password.match(/[0-9]*/)!=null){
    div.innerHTML='<font color="#32CD32">密码符合要求。密码强度：强!</font>';
    return true;
    }
    }
      /*验证确认密码*/
    function checkrepassword(){
    var div=document.getElementById("div3");
    div.innerHTML="";
    var password=document.form1.reg_p.value;
    var repass=document.form1.reg_p2.value;
    if(repass=="") {
    div.innerHTML="确认密码不位空！";
    return false;
    }
    if(password!=repass) {
    div.innerHTML="输入密码和确认密码不一致";
    return false;
    }
    div.innerHTML='<font color="#32CD32">密码输入正确！</font>';
    return true;
    }  /*验证邮箱*/
    function checkEmail(){
    var div=document.getElementById("div4");
    div.innerHTML="";
    var email=document.form1.reg_m.value;
    var sw =email.indexOf("@",0);
    var sw1=email.indexOf(".",0);
    var tt=sw1-sw;
    if(email.length==0) {
    div.innerHTML="电子邮件不能位空";
    return false;
    }
    if(email.indexOf("@",0)==-1){
    div.innerHTML="电子邮件格式不正确，必须包含@符号";
    return false;
    }
    if(email.indexOf(".",0)==-1){
    div.innerHTML="电子邮件格式不正确，必须包含.符号";
    return false;
    }
    if(tt==1){
    div.innerHTML="邮件格式不对。@和.不可以挨着！";
    return false;
    }
    if(sw>sw1) {
    div.innerHTML="电子邮件格式不正确，@符号必须在.之前";
    return false;
    }div.innerHTML='<font color="#32CD32">邮箱格式符合要求！</font>';
    return true;}
     /*验证验证码*/
    function getcode(){
     var code="javascript:this.src=this.src+'?rnd=' + Math.random();";
    }
    function checkcode() {  
         var div=document.getElementById("div5");
         div.innerHTML=""; 
         var inputCode = document.getElementById("reg_v").value; 
     var code=document.getElementById("reg_v_img").innerText;
     var code=getcode();
         if(inputCode.length <=0)   
           {   
              div.innerHTML="请输入验证码！";
              return false; 
          }   
           if(inputCode != code )   
           {   
              div.innerHTML="验证码输入错误！";
              return false;  
           }   
            div.innerHTML='<font color="#32CD32">验证码输入正确！</font>';
             return true;   
          }   /*验证全部*/
    function check(){
    if(checkname()&&checkpassword()&&checkrepassword()&&checkEmail()&&checkcode()){
    return true;
    }
    else {
    alert("请按要求注册！")
    return false;
    }
    }
    </script>
    </head> <body>
     <div id="container"> 
       <form  name="form1" method="post" id="reg_fm" action="#"  onsubmit="check()" target=reg_Hide_Frame> 
        <div id="reg_tb" cellpadding=0 cellspacing=0 border="0"> 
        
            <div class="lb">用 户 名 ：</div>
            <input class="lt" type="text" id="reg_u" onkeyup="checkname()">
             <div class="hint" id="div1"></div>
            <div class="gray">请输入4~16个字节（数字，字母和下划线）</div> 
           
           <div class="lb">设置密码：</div> 
           <input class="pa" type="password" id="reg_p" onkeyup="checkpassword()">
           <div class="hint" id="div2"></div>
           <div class=gray>密码长度6～16位，字母区分大小写。</div>
      
           <div class="lb">确认密码：</div> 
           <input class="pa" type="password" id="reg_p2" onkeyup="checkrepassword()">
           <div class="hint" id="div3"></div>
           <div class=gray>请输入相同密码！</div>
       
           <div class="lb">性　　别：</div> 
           <input name="sex" type="radio" id="reg_sex_m" value="1" checked>
           <label for="reg_sex_m">男</label> 
           <input name="sex" type="radio" id="reg_sex_f" value="2">
           <label for=reg_sex_f>女</label>
           <div class=gray>注册过后不能更改！</div>
           
            <div class="lb">电子邮件：</div>
            <input class="ma" type="text" id="reg_m" onkeyup="checkEmail()">
            <div class="hint" id="div4"></div> 
            <div class=gray>请输入有效的邮件地址，当密码遗失时凭此领取</div> 
       
            
            <div class="lb">验 证 码：</div> 
            <input id="reg_v" class="v" type="text" size="4" onkeyup="checkcode()"> 
             <a href="#">
             <img src="shengcheng.asp" id="reg_v_img" onclick="javascript:this.src=this.src+'?rnd=' + Math.random();" alt="" title="看不清,点击刷新"/>
              看不清？点击图片刷新</a>        <div class="hint" id="div5"></div>
             <br />
             
             <input type="submit" id="reg_submit" value="同意以下协议并提交">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
             <input type="reset" id="reg_reset" value="重置" />
             <textarea id="reg_note">
             </textarea>         
          </div> 
        </form>
       </div>
       <div>
          <iframe style='display:none' src='about:blank' id=reg_Hide_Frame name=reg_Hide_Frame></iframe>
       </div>
       </body> </html>
      

  6.   

    1、这是什么东东？
    background-image:url(file:///C|/Users/laonon/Desktop/js%E9%AA%8C%E8%AF%81/gou.png);
    你还是把它移动到网站内部吧，例如：background: url(x.png);2、【不知道怎么用js获得shengcheng.asp这个文件产生的验证码，只能获得输入的验证码】：
    产生的验证码是生成文件里用session（）记录的，不是JS得到的。到shengcheng.asp里去看源码
      

  7.   

    http://topic.csdn.net/u/20081231/13/1b5c7f90-6302-49e3-8668-a8c690167bc0.html
    8楼