數(shù)據(jù)有效性，安全性驗證 3層

• 客戶端 js腳本驗證
• 服務(wù)端 java-Servlet 服務(wù)器語言
• 數(shù)據(jù)庫 數(shù)據(jù)約束。

onsubmit 事件(表單提交事件)，提交表單時觸發(fā)。onsubmit會接受 true或false返回值。返回true提交當(dāng)前表單，返回false 不提交表單

使用getElementById()獲取Email的值
使用字符串方法indexOf( ) 判斷Email的值是否包含“@”和“.”符號。
根據(jù)函數(shù)返回值是true還是flase來決定是否提交表單

var mail=document.getElementById("email").value;
if(mail.indexOf("@")==-1){
  alert("Email格式不正確\n必須包含@");
   return false;   
}

使用String對象的length屬性驗證密碼的長度

var pwd=document.getElementById("pwd").value;
if(pwd.length<6){
      alert("密碼必須等于或大于6個字符");
      return false; 
}

驗證兩次輸入密碼是否一致

var repwd=document.getElementById("repwd").value;
if(pwd!=repwd){
     alert("兩次輸入的密碼不一致");
     return false;   
}

使用length屬性獲取文本長度，使用for循環(huán)和substring()方法依次截斷單個字符，判斷每個字符是否是數(shù)字

var user=document.getElementById("user").value;
    for(var i=0;i<user.length;i++){
    var j=user.substring(i,i+1)
    if(isNaN(j)==false){
       alert("姓名中不能包含數(shù)字");
       return false;   
    }
    }

• 事件
  • onblur 失去焦點，當(dāng)光標(biāo)離開某個文本框時觸發(fā)
  • onfocus 獲得焦點，當(dāng)光標(biāo)進(jìn)入某個文本框時觸發(fā)
  • onkeypress 某個鍵盤按鍵被按下并松開
• 方法
  • blur() 從文本域中移開焦點
  • focus() 在文本域中設(shè)置焦點，即獲得鼠標(biāo)光標(biāo)
  • select() 選取文本域中的內(nèi)容
• 屬性

  • id 設(shè)置或返回文本域的id

  • value 設(shè)置或返回文本域的balue屬性的值

      function clearText(){
          var mail=document.getElementById("email");
          if(mail.value=="請輸入正確的電子郵箱"){
          mail.value="";
          mail.style.borderColor="#ff0000";
          }
      }
      ……
      <td>Email：<input id="email" type="text"  class="inputs" value="請輸入正確的電子郵箱" onfocus="clearText()"/></td>
    </tr>
    
    
      if(mail.indexOf("@")==-1 || mail.indexOf(".")==-1){
          alert("Email格式不正確\n必須包含符號@和.");
          document.getElementById("email").select();
          return false;
      }
    
    
      function checkEmail(){
          var mail= document.getElementById ("email");
          var divID= document.getElementById ("DivEmail");
          divID.innerHTML="";
          if(mail.value==""){
               divID.innerHTML="Email不能為空";
               return false;
          }
      }
      ……
    

    <input id="email" type="text" class="inputs" onblur="checkEmail()"/>
    <div class="red" id="DivEmail"></div>