2013-07-16 67 views
0

所以我有這個註冊表格,我用javascript檢查事情。當它有正確的輸入時,我會讓它顏色改變。如果所有的netrys都是正確的,我會讓提交按鈕變得可見。但問題是當我在我的最後一個文本框中,爲了讓代碼運行,我必須單擊另一個文本框,因此我在其中添加了一個額外的複選框,以便用戶必須檢查它並驗證它是否正常並顯示提交按鈕。但是如果我添加這個複選框,整個腳本就不再工作了。更多用戶友好形式

<script> 
     function start(){ 
      var element=document.getElementById("name"); 
      element.style.background="yellow"; 
      element=document.getElementById("pass1"); 
      element.style.background="yellow"; 
      element=document.getElementById("pass2"); 
      element.style.background="yellow"; 
      element=document.getElementById("email"); 
      element.style.background="yellow"; 
      document.getElementById('button').style.visibility='hidden'; 
     } 
     function check(obj,form){ 
      var check=0; 
      var data1=form.pass1.value; 
      var data2=form.pass2.value; 
      var element=document.getElementById("pass1"); 
      var element2=document.getElementById("pass2"); 
      if(data1==data2 && data1!=null && data2!=null && data1!='' && data2!=''){ 
       element.style.background="green"; 
       element2.style.background="green"; 
       check++; 
      } 
      element=document.getElementById("name"); 
      data1=form.name.value; 
      if(data1==null || data1==''){ 
       element.style.background="yellow"; 
      } 
      else{ 
       element.style.background="green"; 
       check++; 
      } 
      element=document.getElementById("email"); 
      data1=form.email.value; 
      var atpos=data1.indexOf("@"); 
      var dotpos=data1.lastIndexOf("."); 
      if(atpos<1 || dotpos<atpos+2 || dotpos+2>=data1.length){ 
       element.style.background="yellow"; 
      }else{ 
       element.style.background="green"; 
       check++; 
      } 
      if(check==3){ 
       document.getElementById('button').style.visibility='visible'; 
      }else{ 
       document.getElementById('check').checked=false; 
      } 
      obj.style.background="yellow"; 
     } 
    </script> 
</head> 
<body onload="start();"> 
    <div id="register"> 
    <form name="login" action="logon.php" method="post"> 
     Username:<input id="name" onfocus="check(this,this.form)" name="username" type="text" size="14"/><br> 
     Password:<input id="pass1" onfocus="check(this,this.form)" name="password1" type="password" size="14"/><br> 
     Repeat Password:<input id="pass2" onfocus="check(this,this.form)" name="password2" type="password" size="14"/><br> 
     Email:<input id="email" onfocus="check(this,this.form)" name="email" type="text" size="14"/><br> 
     Validate<input id="check" onfocus="check(this,this.form)" type="checkbox"/><br> 
     <input type="submit" id="button" name="submit" value="Register"/> 
    </form> 
    </div> 
+2

焦點事件觸發只有當你進入這個領域。你嘗試過'改變'或'鍵盤'事件嗎? 'keyup'可能需要更多的處理能力,但看着你的代碼應該不成問題。當你離開現場併發生變化時,「變化」就會發生。 – Puuskis

+2

我希望你有一個很好的理由不使用CSS和jQuery。 – n3rd

+0

onchange和keyup不會做任何事情 – stevedc

回答

0

更改您的複選框的ID別的東西。然後它會工作例如: -

<input id="checkbox" onfocus="check(this,this.form)" type="checkbox"/> 
+0

如果我改變onchange到onchange代碼做它必須做的事情 – stevedc