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

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

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

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

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

解決辦法：

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

通過監(jiān)聽form的submit事件，對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: "請輸入姓名",
            email: {
                required: "請輸入Email地址",
                email: "請輸入正確的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);
            });
        }
    }
}


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

我在注冊表單新加了一個驗證碼。驗證結(jié)果錯誤時，這個錯誤信息跑到驗證碼前面去了。如下圖所示：


目的：讓錯誤信息在驗證碼后面

現(xiàn)象二：


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

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

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

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

相關(guān)文章

最新評論