基於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;
}
}