關(guān)于jquery.validate1.9.0前臺(tái)驗(yàn)證的使用介紹_jquery

現(xiàn)象：當(dāng)提交表單時(shí)，即使前臺(tái)未驗(yàn)證通過(guò)，也照常提交表單。

解決辦法：
代碼如下:
$('#myForm').submit(function(){
if (!$(this).valid()) return false;//加上此句OK
$('.error').html('');
$("#go").prop("disabled",true);
$(this).ajaxSubmit({
type:"POST",
//beforeSubmit: showRequest,
dataType:'json',
success: showResponse
});
return false;
});

相關(guān)說(shuō)明：

定制提交方式(ajax提交)
如果使用ajax方式提交，那請(qǐng)采用如下兩種方式和校驗(yàn)框架結(jié)合
1)、使用submitHandler屬性配置ajax提交，submithandler：當(dāng)表單全部校驗(yàn)通過(guò)之后會(huì)回調(diào)配置的代碼，此處也就是當(dāng)校驗(yàn)通過(guò)之后調(diào)用ajax提交。
2)、使用valid方法，監(jiān)聽form的submit事件，當(dāng)$('#form').valid()返回true的時(shí)候再提交。

通過(guò)監(jiān)聽form的submit事件，對(duì)form進(jìn)行ajax提交。示例完整代碼如下：
代碼如下:
$(document).ready(function(){

$('#myForm').submit(function(){
if (!$(this).valid()) return false;
$('.error').html('');
$("#go").prop("disabled",true);
$(this).ajaxSubmit({
type:"POST",
//beforeSubmit: showRequest,
dataType:'json',
success: showResponse
});
return false;
});

var validator = $("#myForm").validate({
rules: {
username: "required",
email: {
required: true,
email: true
}
},
messages: {
username: "請(qǐng)輸入姓名",
email: {
required: "請(qǐng)輸入Email地址",
email: "請(qǐng)輸入正確的email地址"
}
}
});

});

function showResponse(jsonData,statusText)
{
if(statusText=='success')
{
$("#go").prop("disabled",false);
if (jsonData.status == 1)
{
$("#return").html(jsonData.message);
}
else
{
$.each(jsonData.errors, function(k,v){
//$('#output').find('ul').append('

我在注冊(cè)表單新加了一個(gè)驗(yàn)證碼。驗(yàn)證結(jié)果錯(cuò)誤時(shí)，這個(gè)錯(cuò)誤信息跑到驗(yàn)證碼前面去了。如下圖所示：

目的：讓錯(cuò)誤信息在驗(yàn)證碼后面

現(xiàn)象二：

上圖中的紅色提示內(nèi)容，我想移到 (* 必填) 的后面。

上面兩個(gè)現(xiàn)象，可通過(guò)jquery.validate自帶的控制錯(cuò)誤信息位置的方法——'errorPlacement'，使用也很方便：
代碼如下:
errorPlacement: function(error, element)
{
error.appendTo(element.parent());
}

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com