jquery validate 自定義驗(yàn)證方法介紹 日期驗(yàn)證
jquery validate有很多驗(yàn)證規(guī)則,但是更多的時候,需要根據(jù)特定的情況進(jìn)行自定義驗(yàn)證規(guī)則。
這里就來聊一聊jquery validate的自定義驗(yàn)證。
jquery validate有一個方法,可以讓用戶來自定義驗(yàn)證規(guī)則。
案例一:
//自定義驗(yàn)證
$.validator.addMethod("isPositive",function(value,element){
var score = /^[0-9]*$/;
return this.optional(element) || (score.test(value));
},"<font color='#E47068'>請輸入大于0的數(shù)字</font>");
通過addMethod用戶可以自定義自己的驗(yàn)證規(guī)則
這個方法有三個參數(shù),第一個參數(shù)表示驗(yàn)證規(guī)則名稱,這里是isPositive,表示是否為正數(shù)。
第二個參數(shù)是真正的驗(yàn)證主體,它是一個函數(shù),函數(shù)的第一個value表示調(diào)用這個驗(yàn)證規(guī)則的表單的值,第二個element可以用來判斷是否為空,為空的時候,就不調(diào)用這個驗(yàn)證規(guī)則了。
第三個參數(shù)是返回的錯誤提示。
具體如何使用呢?
其實(shí)跟jquery validate固有的驗(yàn)證規(guī)則使用是一樣的。
<tr bgcolor="#f7f7f7" height="43" align="right">
<td class="font14_s pdr_12 grey_70">總分:</td>
<td class="font14_s pl40" align="left"><input type="text" id="fullscore" name="fullscore" style=" margin-left: 10px; margin-right: 2px;" value="<!--{$aExams.fullscore}-->" class="required number isPositive input_233" /></td>
</tr>
如上所示,加粗的地方就是使用的方法,一共用了三個驗(yàn)證規(guī)則,一個是必須,一個是數(shù)字,一個是自定義驗(yàn)證規(guī)則。
效果圖如下:
案例二:
表單提交時,經(jīng)常會需要對日期進(jìn)行驗(yàn)證,比如結(jié)束時間必須大于開始時間。
這個時候可以通過jquery validate 自定義一個驗(yàn)證方法,進(jìn)行驗(yàn)證。
方法如下:
$.validator.addMethod("compareDate",function(value,element){
var assigntime = $("#assigntime").val();
var deadlinetime = $("#deadlinetime").val();
var reg = new RegExp('-','g');
assigntime = assigntime.replace(reg,'/');//正則替換
deadlinetime = deadlinetime.replace(reg,'/');
assigntime = new Date(parseInt(Date.parse(assigntime),10));
deadlinetime = new Date(parseInt(Date.parse(deadlinetime),10));
if(assigntime>deadlinetime){
return false;
}else{
return true;
}
},"<font color='#E47068'>結(jié)束日期必須大于開始日期</font>");
上述代碼紅色部分是對時間字符串進(jìn)行處理,處理成2013/12/12 08:09:00這種標(biāo)準(zhǔn)格式,
在處理的時候要用到replace的方法,這個方法最后結(jié)合正則表達(dá)式進(jìn)行使用,也就是第一行的reg對象。
替換完了之后,如果比較時間呢?要進(jìn)行三個處理,
1.將標(biāo)準(zhǔn)時間轉(zhuǎn)化為時間戳通過Date.parse()方法來處理。
2.將時間戳轉(zhuǎn)化為整數(shù),確保萬一,通過parseInt("",10)來處理。
3.將時間戳轉(zhuǎn)為日期對象new Date()。
轉(zhuǎn)為對象之后,就能夠比較時間大小了,直接判斷,如果結(jié)束時間小于開始時間,就進(jìn)行錯誤提示。
這個時候compareDate就可以像其他的jquery validate驗(yàn)證規(guī)則一樣驗(yàn)證了。
案例三:ajax驗(yàn)證
去數(shù)據(jù)庫驗(yàn)證用戶名是否存在,這個也會經(jīng)常用到。
$.validator.addMethod("checkUserExist",function(value,element){
var user = value;
$.ajax({
type:"POST",
async:false,
url:"/default/index/ajax/do/ajaxcheckuser",
data:"nick="+user,
success:function(response){
if(response){
res = false;
}else{
res = true;
}
}
});
return res;
},"<font color='#E47068'>用戶名已存在</font>");
后臺驗(yàn)證代碼:
case 'ajaxcheckuser':
$nick = trim($this->_getParam('nick'));
if(isset($nick)){
$where['lx_user.nick = ?'] = array('type'=>1,'val'=>$nick);
$aUser = $daoUser->getUser($where);
if(count($aUser)>=1){
echo TRUE;
}else{
echo FALSE;
}
}else{
echo FALSE;
}
break;
如果數(shù)據(jù)庫中存在,就返回true。
- javascript日期驗(yàn)證之輸入日期大于等于當(dāng)前日期
- php提取身份證號碼中的生日日期以及驗(yàn)證是否為成年人的函數(shù)
- C#驗(yàn)證給定字符串形式日期是否合法的方法
- C#中判斷、驗(yàn)證字符串是否為日期格式的實(shí)現(xiàn)代碼
- JS驗(yàn)證日期的格式Y(jié)YYY-mm-dd 具體實(shí)現(xiàn)
- Winform之TextBox輸入日期格式驗(yàn)證yyyy-mm-dd
- javascript 驗(yàn)證日期的函數(shù)
- JS 日期驗(yàn)證正則附asp日期格式化函數(shù)
- 如何驗(yàn)證日期輸入是否正確?
- 兩行代碼輕松搞定JavaScript日期驗(yàn)證
相關(guān)文章
淺談jQuery中對象遍歷.eq().first().last().slice()方法
本文給大家分析了jQuery中的對象遍歷.eq().first().last().slice()方法的使用,以及他們之間的區(qū)別,jQuery源碼中的使用。2014-11-11jquery中判斷圖片是否存在的實(shí)現(xiàn)代碼
有時候我們需要判斷當(dāng)前的圖片是否存在,方便后期做一些操作,當(dāng)然也可以參考上一篇文章,如果不存在就替換位默認(rèn)圖片2023-06-06基于jQuery替換table中的內(nèi)容并顯示進(jìn)度條的代碼
這個例子使我更加明白呈現(xiàn)數(shù)據(jù)是前端工作滴一部分,如何使table中的數(shù)值變?yōu)榍逦貤l狀圖呢?聽我細(xì)細(xì)道來2011-08-08jquery得到font-size屬性值實(shí)現(xiàn)代碼
font-size屬性想必大家并不陌生吧,此屬性控制字體的大小,在本文將為大家介紹下如何使用jquery獲取font-size屬性值,感興趣的朋友可以參考下2013-09-09jQuery實(shí)現(xiàn)智能判斷固定導(dǎo)航條或側(cè)邊欄的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)智能判斷固定導(dǎo)航條或側(cè)邊欄的方法,涉及jQuery針對頁面元素屬性的判斷與動態(tài)操作相關(guān)技巧,需要的朋友可以參考下2016-09-09jQuery基于ajax實(shí)現(xiàn)星星評論代碼
這篇文章主要介紹了jQuery基于ajax實(shí)現(xiàn)星星評論代碼,可實(shí)現(xiàn)實(shí)時顯示評論效果的功能,基于Ajax實(shí)現(xiàn),非常具有實(shí)用價值,需要的朋友可以參考下2015-08-08