基於PHP+Ajax實現表單驗證的詳解

來源:文萃谷 1.41W

文章是對PHP+Ajax實現表單驗證的代碼進行了詳細的分析介紹,需要的朋友參考下。

基於PHP+Ajax實現表單驗證的詳解

  一,利用鍵盤響應,在不刷新本頁面的情況下驗證表單輸入是否合法

用户通過onkeydown和onkeyup事件來觸發響應事件。使用方法和onclick事件類似。onkeydown表示當鍵盤上的鍵被按下時觸發,onkeyup和它正好相反,當鍵盤上的鍵被按下又抬起時觸發。

兩種常用調用方法:

(1)將事件添加到頁面元素中,當用户輸入完信息後,單擊任意鍵,onkeydown事件被觸發,並調用refer()函數。

這種方法最簡單,最直接,格式如下:

複製代碼 代碼如下:

<script type="text/javascript">

...

function refer(){

...

}

</script>

<input type="text" onkeydown="refer()"/>

(2)通過ad加載,當頁面被載入時,事件被載入。當用户輸入信息時,每輸入一個字母,都將觸發該事件,在該事件調用的函數中,對用户輸入信息進行判斷。

複製代碼 代碼如下:

ad = function(){

$('regname')ydown = function (){

name = $('regname')e;

}

}

使用onkeydown事件還可以實現對特定鍵的控制,包括<Enter>鍵(ode==13)、空格鍵(ode==32)、<Ctrl>鍵、<Alt>鍵等所有的按鍵,這是通過在onkeydown事件中使用keyCode屬性來實現的。KeyCode屬性能夠知道用户按下的是哪個鍵。

  二,註冊信息驗證

通用函數,返回被觸發的'id元素對象

複製代碼 代碼如下:

function $(id){

return lementById(id);

}

ad事件,表示當前窗口被載入時觸發。function(){...}表示當前頁面被載入時所要進行的操作。

ad = function(){

...

}

function()函數解析;

首先將焦點定位到用户名文本框,方便用户操作。接下來聲明瞭5個變量,這5個變量代表了5個要檢測的數據的結果。當檢測數據為合格時,將變量值設為"yes".

複製代碼 代碼如下:

$('regname')s();

var cname1,cname2,cpwd1,cpwd2; //聲明瞭5個變量,表示要檢測的5項數據chkreg()函數是每一次觸發鍵盤事件後都要調用的,該函數判斷5個變量的值,只有當所有變量都為"yes"時,註冊按鈕才會被激活

function chkreg(){

if((cname1 == 'yes') && (cname2 == 'yes') && (cpwd1 == 'yes') && (cpwd2 == 'yes')){

$('regbtn')bled = false;

}else{

$('regbtn')bled = true;

}

}

熱門標籤