推薦閱讀:Javascript的表單驗證長度
Javascript的表單驗證-提交表單
Javascript的表單驗證-初識正則表達式
Javascript的表單驗證-揭開正則表達式的面紗
JavaScript 可用來在數據被送往服務器前對 HTML 表單中的這些輸入數據進行驗證。
表單提交前要檢查數據的合法性
在要對表單裡的數據進行驗證的時候,可以利用getElementById()來訪問網頁上任何一個元素
每個表單域都有一個form對象,可被傳給任何驗證表單數據的函數
<input id="zipcode" name="zipcode" type="text" size="5" onclick="showIt(this.form)"/> function showIt(thisForm) { alert(thisForm["zipcode"].value); //通過form對象的name屬性,取得元素的值 }
利用name屬性或getElementById()方法都可以完成對元素的獲取
檢查表單數據的時機,取決於選擇正確的用戶輸入事件去處理。
也就是說,當用戶輸入數據後立即對數據驗證。
用戶在輸入數據時的順序是:
選擇輸入域
在域裡輸入數據
離開該域,移往下個目標
選擇下個目標域
在域裡輸入數據
在這個過程中,會激發一系列的事件,利用這些事件,可以找到對數據驗證的時機
1) 選中輸入域時 –激發onfocus事件(焦點)
2) 離開輸入域時 –激發onblur事件(離開焦點)
3) 離開該域並且輸入內容發生改變時 –激發onchange事件
最正確的選擇是在激發onblur事件時去對數據進行驗證
驗證的第一步:檢查域不為空
<input id="phone" name="phone" type="text" size="12" onblur="validateNonEmpty(this)"/>
調用validateNonEmpty來響應onblur事件
表單對象使用關鍵字this被傳至函數
以下是驗證函數
function validateNonEmpty(inputField) { if(inputField.value.length==0) { alert("Please enter a value."); return false; } return true; }
在網頁表單進行提交的時候,一定要對用戶輸入的數據進行驗證
在要對表單裡的數據進行驗證的時候,可以利用getElementById()來訪問網頁上任何一個元素
以上內容是針對Javascript的表單與驗證-非空驗證的全部敘述,希望對大家有所幫助!