Javascript的表單驗證長度
更新時間:2016年03月16日 11:08:20 作者:WeAreZero
JavaScript 可用來在數(shù)據(jù)被送往服務(wù)器前對 HTML 表單中的這些輸入數(shù)據(jù)進行驗證。通過本文給大家介紹Javascript的表單驗證長度,需要的朋友參考下吧
JavaScript 可用來在數(shù)據(jù)被送往服務(wù)器前對 HTML 表單中的這些輸入數(shù)據(jù)進行驗證。
該采用什么樣的方式對用戶作出提醒呢?你一定不想用alert()提示框
在輸入域后加一個sqan標簽
<input id="phone" name="phone" type="text" size="12" onBlur="validateNonEmptyFun(this,document.getElementById('phone_help'));" /> <span id="phone_help" class="help"></span> function validate_Length(inputFiled,helpText) { //如果輸入域內(nèi)容是空,則在span標簽內(nèi)提醒 if(inputFiled.value.length==0) { if(helpText!=null) helpText.innerHTML="文本框不能為空"; } //如果輸入域不空,則清空span標簽內(nèi)的內(nèi)容 else if(helpText!=null) helpText.innerHTML="" } </script>
helpText是傳入的span對象
用span標簽來為用戶作出提醒,不會像alert那樣阻擋用戶視覺
除了非空驗證,還有尺寸問題
驗證數(shù)據(jù)長度
<input id="phone" name="phone" type="text" size="12" onBlur="validate_Length(1,32,this,document.getElementById('phone_help'));" /> <span id="phone_help" class="help"></span>
這里的參數(shù)變成了四個,第一個是文本最小長度,第二個是文本最長長度
function validate_Length(minLegth,maxlength,inputFiled,helpText) { if(inputFiled.value.length<minLegth||inputFiled.value.length>maxlength) { if(helpText!=null) { helpText.innerHTML="請輸入長度為"+minLenght+"到"+maxLength+"的文本"; return false; } } else if(helpText!=null) { helpText.innerHTML="" return true; } }
驗證郵政編碼
function validate_ZipCode(inputFiled,helpText) { if(inputFiled.value.length!=5) { if(helpText!=null) helpText.innerHTML="郵政編碼長度必須為5位"; return false; } else if(isNaN(inputFiled.value)) { if(helpText!=null) helpText.innerHTML="郵政編碼必須為數(shù)字"; return false; } else if(helpText!=null) { helpText.innerHTML="" return true; } }
相關(guān)文章
JavaScript對表格或元素按文本,數(shù)字或日期排序的方法
這篇文章主要介紹了JavaScript對表格或元素按文本,數(shù)字或日期排序的方法,涉及javascript頁面元素操作及排序的相關(guān)技巧,需要的朋友可以參考下2015-05-05寫入cookie的JavaScript代碼庫 cookieLibrary.js
cookieLibrary.js 寫入cookie的JavaScript代碼庫,需要的朋友可以參考下。2009-10-10