欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

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

 更新時(shí)間：2013年04月26日 11:18:44   作者：  
本篇文章介紹了，關(guān)于jquery.validate1.9.0前臺(tái)驗(yàn)證的使用。需要的朋友參考下

一、利用jquery.form插件提交表單方法使用jquery.validate插件

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

解決辦法：

復(fù)制代碼 代碼如下:

$('#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)說明：

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

通過監(jiān)聽form的submit事件，對(duì)form進(jìn)行ajax提交。示例完整代碼如下：

復(fù)制代碼 代碼如下:

$(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('<li>' + v + '</li>');
                $('.e_' + k).html(v);
            });
        }
    }
}


二、控制錯(cuò)誤信息位置的方法
現(xiàn)象一：

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


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

現(xiàn)象二：


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

上面兩個(gè)現(xiàn)象，可通過jquery.validate自帶的控制錯(cuò)誤信息位置的方法——'errorPlacement'，使用也很方便：

復(fù)制代碼 代碼如下:

errorPlacement: function(error, element)
{
    error.appendTo(element.parent());
}

相關(guān)文章

最新評(píng)論