關於jquery.validate1.9.0前台驗證的使用介紹_jquery

一、利用jquery.form外掛提交表單方法使用jquery.validate外掛程式

現象：當提交表單時，即使前台未驗證通過，也照常提交表單。

解決方法：

複製程式碼 代碼如下:

代碼如下:



代碼如下:



代碼如下:    if (!$(this).valid()) return false;//加上此句OK
    $('.error'). html('');
    $("#go").prop("disabled",true);

    $(this).ajaxSubmit({
    /beforeSubmit: showRequest,        dataType:'json',        success: showResponse      success: showResponse

      success: showResponse
   ); 🎜>

相關說明：

自訂提交方式(ajax提交)

如果使用ajax方式提交，那請採用以下兩種方式和校驗框架結合1)、使用submitHandler屬性配置ajax提交，submithandler：當表單全部校驗通過之後會回調配置的程式碼，此處也就是當校驗通過之後呼叫ajax提交。 2)、使用valid方法，監聽form的submit事件，當$('#form').valid()回傳true的時候再提交。 透過監聽form的submit事件，對form進行ajax提交。範例完整程式碼如下：

複製程式碼 程式碼如下:

$(文檔).ready(function(){

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

    var validator = $("#myForm").validate({          電子郵件： true
          訊息: {
            使用者名稱: "請輸入姓名",
            電子郵件: {

                "

            }
        }
    });

});

{
    if(statusText=='成功')
    {
  d.
        if (jsonData.status == 1)
        {
       }
        else
        {
            $ .each(jsonData.errors, function(k,v){

               //$('#output').find('ul').append('

' v //$('#output').find('ul').append('

' v //$('#output').find('ul').append('

' v //$('#output').find('ul').append('

' v //$('#output').find('ul')。

                $('.e_' k).html(v);

         

二、控制錯誤訊息位置的方法
現像一：

我在蘿蔔單新加了驗證碼。驗證結果出錯時，這個錯誤訊息跑到驗證碼前面去了。如下圖：






目的：讓錯誤訊息在驗證碼後面

現象二：

上面的紅色提示內容，我想移到(*必填)的後面。

上面的兩個現象，可以透過jquery.validate自帶的控制錯誤訊息位置的方法－'errorPlacement'，使用也很方便：

複製程式碼

程式碼如下：

errorPlacement: function(error, element)

{  endo > }