輕鬆玩轉花樣表單表單提交(轉)[@more@]

　　三、表單的提交

　　既然表單是用來採集使用者輸入的資料，那麼，就應該保證使用者的資料被準確地提交到預定的地點，也就是說，我們在表單提交的時候，應該對使用者的資料進行檢驗，一來可以避免使用者誤輸資料，二來可以避免使用者輸入非法的，或者說不合格的資料；檢驗合格以後，還要保證使用者的資料提交到特定的程式。

　　1．資料的檢驗

　　資料的檢驗，通常有兩種程式：客戶端檢驗和伺服器端檢驗。客戶端檢驗，比較快，伺服器端檢驗，相對來說比較慢，為了確保安全，通常同時採用，這樣就可以避免使用者刻意破壞。

　　不管採用什麼方式，資料檢驗的原理都是一樣的，一旦使用者輸入的資料不符合規定，就報錯，要求使用者重新輸入，客戶端檢驗常使用Javascrip指令碼，伺服器端的視系統而定，本文不對資料檢驗的具體程式設計進行探討，僅僅列舉幾個例子來說明。

　樣例19：必填項，以及簡單的資料型別檢驗

　　分析：

本例給表單新增了onSubmit事件，透過onSubmit="return CheckDate()"指定提交前，必須透過函式CheckDate()來檢驗，如果不合格，返回輸入資料；
資料檢驗的函式如下：
＜script＞
function CheckDate(){
//取得輸入的資料
userName = document.RedForm.userName.value;
userEmail = document.RedForm.userEmail.value;
//如果沒有輸入姓名
if (userName=="") {
alert("請輸入姓名");
document.RedForm.userName.focus();
return false;
}else{
//如果沒有輸入Email，或者Email地址錯誤(不含@)
if ((userEmail=="")||(userEmail.indexOf("@")==-1)) {
alert("請重新輸入Email地址");
document.RedForm.userEmail.focus();
return false;
}else return true;
}
}
＜/script＞

　　2．表單的分支提交

　　有的時候，表單需要根據使用者的選擇，提交到不同的程式，怎麼做呢？

　　透過指令碼來檢測使用者的選擇分支，從而向不同的程式提交表單，看看樣例：

　樣例20：分支提交

　　分析：這裡首先用到的是form的onSubmit="TwoSubmit(this)"

然後根據選擇的分支，來分別遞交到不同的程式，TwoSubmit()函式如下：

＜script＞

function TwoSubmit(form){

if (form.Ref[0].checked){

form.action = "cop.asp";//這裡是分之一

}else{

form.action = "ind.asp";//這裡是分之二

}

form.submit();

}

＜/script＞

　　3．用任何元素提交表單

　　是不是隻有按鈕或者圖片按鈕才能提交表單呢？當然不是，實際上，任何頁面元素都可以提交表單，不過嘛，都是透過指令碼來完成的，下面我們就使用連結來代替Submit按鈕：

　樣例21：用連結來提交表單

　　分析：

　　透過onClick="document.form.submit()"來提交表單；用onClick="document.form.reset()"來複位表單，這樣一來，任何一個元素都可以實現提交表單了。

輕鬆玩轉花樣表單表單提交(轉)

相關文章