JQuery validate插件Remote用法大全
jquery.validate是jquery旗下的一個(gè)驗(yàn)證框架,借助jquery的優(yōu)勢(shì),我們可以迅速驗(yàn)證一些常見的輸入,還可以自己擴(kuò)充自己的驗(yàn)證方法,并且對(duì)國(guó)際化也有很好的支
JQuery.validate.js 在表單驗(yàn)證中經(jīng)常使用,初學(xué),對(duì)于其中Remote的使用說(shuō)明一下.
. 基本解釋
JQuery主要用于DOM樹和CSS樹的檢索和后面的操作的一套方法,JQuery.validate.js是對(duì)JQuery的一個(gè)插件,可以認(rèn)為是對(duì)JQuery在某個(gè)特殊場(chǎng)景下的擴(kuò)展,而Validate就是對(duì)表單驗(yàn)證提供的擴(kuò)展。
. 場(chǎng)景解釋
用戶進(jìn)行注冊(cè)用戶的時(shí)候,要異步的判斷用戶名是否存在,給出提示信息。
. 通過(guò)案例學(xué)習(xí)
Html和JavaScript結(jié)合的腳本.
<!DOCTYPE html PUBLIC "-//WC//DTD XHTML . Transitional//EN" "http://www.w.org/TR/xhtml/DTD/xhtml-transitional.dtd">
<html xmlns="http://www.w.org//xhtml">
<head>
<script src="../includes/libraries/javascript/jquery.js" type="text/javascript" charset="utf-" ></script>
<script src="../includes/libraries/javascript/jquery.plugins/jquery.validate.js" type="text/javascript" charset="utf-"></script>
<script type="text/javascript">
$().ready(function() {
$("#signupForm").validate({
debug: false,
onkeyup:false,
/*忽略某些元素不做驗(yàn)證*/
//ignore: ".ignore",
/* 更改錯(cuò)誤信息顯示的位置
Default:
errorPlacement: function(error, element) {
error.appendTo(element.parent());
}
error.appendTo(element.parent());
*/
/*
submitHandle: function(form){
alert("submited!");
form.submit();},
*/
rules: {
/*
firstname: {
required: function(){ return true;}},
*/
firstname: {
required: true,
remote: {
url: "Learn.php",
type: "post",
//DataType: "json",
data: {
firstname: function(){
return $("#firstname").val();
}
}}},
phonenum: {
required: true,
digits: true,
rangelength: [,]},
email: {
required: true,
email: true},
password: {
required: true,
minlength: },
confirm_password: {
required: true,
minlength: ,
equalTo: "#password"}
},
messages: {
firstname: {
required: "請(qǐng)輸入姓名",
remote: "請(qǐng)輸入姓名,remote"},
phonenum: {
required: "請(qǐng)輸入手機(jī)號(hào)",
digits: "存在字符,非法手機(jī)號(hào)",
rangelength: "手機(jī)號(hào)位數(shù)不對(duì)"},
email: {
required: "請(qǐng)輸入Email地址",
email: "請(qǐng)輸入正確的email地址"},
password: {
required: "請(qǐng)輸入密碼",
minlength: jQuery.format("密碼不能小于{}個(gè)字 符")},
confirm_password: {
required: "請(qǐng)輸入確認(rèn)密碼",
minlength: "確認(rèn)密碼不能小于個(gè)字符",
equalTo: "兩次輸入密碼不一致不一致"}
},
submitHandler: function(form){
alert("驗(yàn)證通過(guò)");}
});
});
</script>
</head>
<body>
<form id="signupForm" method="post" action="">
<p>
<label for="firstname">姓氏</label>
<input id="firstname" name="firstname" />
</p>
<p>
<label for="phonenum">手機(jī)</label>
<input id="phonenum" name="phonenum" />
</p>
<p>
<label for="email">郵件</label>
<input id="email" name="email" />
</p>
<p>
<label for="password">密碼</label>
<input id="password" name="password" type="password" />
</p>
<p>
<label for="confirm_password">確認(rèn)密碼</label>
<input id="confirm_password" name="confirm_password" type="password" />
</p>
<p>
<input class="submit" type="submit" value="提交"/>
</p>
</form>
</body>
</html>
后臺(tái)PHP代碼 BaseFunction.php
<?php
function WriteLog($msg)
{
$filename = dirname(__FILE__) ."\\Debug.log";
$handler = null;
if (($handler = fopen($filename, 'ab+')) !== false)
{
fwrite($handler, "\n".'['.date('Y-m-d H:i:s').']'."\t".$msg);
fclose($handler);
}
}
function CheckUser($UserName) {
if( $_REQUEST[$UserName] == 'php' ){
exit("false");
}
else{
exit("true");
}
}
?>
后臺(tái)PHP代碼 Learn.php
<?php
require("BaseFunction.php");
CheckUser('firstname');
?>
以上所述是小編給大家介紹的JQuery validate插件Remote用法大全的相關(guān)知識(shí),希望對(duì)大家以上幫助!
- jQuery Validate表單驗(yàn)證插件 添加class屬性形式的校驗(yàn)
- jQuery easyui的validatebox校驗(yàn)規(guī)則擴(kuò)展及easyui校驗(yàn)框validatebox用法
- jquery.validate 自定義驗(yàn)證方法及validate相關(guān)參數(shù)
- jQuery插件Validate實(shí)現(xiàn)自定義校驗(yàn)結(jié)果樣式
- jquery.validate提示錯(cuò)誤信息位置方法
- jQuery validate插件submitHandler提交導(dǎo)致死循環(huán)解決方法
- jquery.validate使用時(shí)遇到的問(wèn)題
- jquery表單驗(yàn)證插件(jquery.validate.js)的3種使用方式
- 基于Bootstrap+jQuery.validate實(shí)現(xiàn)Form表單驗(yàn)證
- jQuery驗(yàn)證插件 Validate詳解
- 使用jquery.validate自定義方法實(shí)現(xiàn)"手機(jī)號(hào)碼或者固話至少填寫一個(gè)"的邏輯驗(yàn)證
- Jquery validation remote 驗(yàn)證的緩存問(wèn)題解決方法
- JQuery的Validation插件中Remote驗(yàn)證的中文問(wèn)題
- jQuery Validation插件remote驗(yàn)證方式的Bug解決
相關(guān)文章
jQuery查找節(jié)點(diǎn)并獲取節(jié)點(diǎn)屬性的方法
這篇文章主要介紹了jQuery查找節(jié)點(diǎn)并獲取節(jié)點(diǎn)屬性的方法,涉及jQuery簡(jiǎn)單獲取節(jié)點(diǎn)及attr與text方法讀取元素屬性的相關(guān)技巧,需要的朋友可以參考下2016-09-09
Jquery中國(guó)地圖熱點(diǎn)效果-鼠標(biāo)經(jīng)過(guò)彈出提示層信息的簡(jiǎn)單實(shí)例
本篇文章主要是對(duì)Jquery中國(guó)地圖熱點(diǎn)效果-鼠標(biāo)經(jīng)過(guò)彈出提示層信息的簡(jiǎn)單實(shí)例進(jìn)行了介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2014-02-02
jQuery實(shí)現(xiàn)文件上傳進(jìn)度條特效
帶進(jìn)度條的文件上傳特效,每個(gè)文件都有進(jìn)度條,都有上傳詳情介紹。效果非常不錯(cuò),這里推薦給大家。2015-08-08
jQuery實(shí)現(xiàn)輸入框下拉列表樹插件特效代碼分享
這篇文章主要介紹了jQuery實(shí)現(xiàn)輸入框下拉列表樹特效,推薦給大家,有需要的小伙伴可以參考下。2015-08-08
jquery中event對(duì)象屬性與方法小結(jié)
本篇文章主要是對(duì)jquery中的event對(duì)象屬性與方法進(jìn)行了詳細(xì)的總結(jié)介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2013-12-12
bootstrap與Jquery UI 按鈕樣式?jīng)_突的解決辦法
這篇文章主要介紹了bootstrap與Jquery UI 按鈕樣式?jīng)_突的解決辦法的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-09-09
jquery自動(dòng)切換tabs選項(xiàng)卡的具體實(shí)現(xiàn)
這篇文章主要介紹了jquery自動(dòng)切換tabs選項(xiàng)卡的具體實(shí)現(xiàn),有需要的朋友可以參考一下2013-12-12
jQuery實(shí)現(xiàn)點(diǎn)擊文本框彈出熱門標(biāo)簽的提示效果
點(diǎn)擊文本框彈出熱門標(biāo)簽的效果實(shí)現(xiàn)方法有很多,在本文為大家詳細(xì)介紹下使用jQuery是如何實(shí)現(xiàn)的,感興趣的朋友不要錯(cuò)過(guò)2013-11-11

