jquery.validate是一個非常方便的前端校驗外掛，在submit提交時會自動校驗，並給出提示，如果校驗不通過，則阻止提交。但是如果需要ajax方式進行後臺請求，則需要手動呼叫validate進行校驗判斷，具體方式如下：

程式碼塊(依賴jquery框架)

1.初始化校驗：

 $(function () {
           //表單校驗，queryForm為表單id
            $('#queryForm').validate({
                errorElement:"em",
                errorClass:"red",
                rules: {
                    userName: {required: true}//userName為input框id
                },
                messages: {
                    companyId: {
                        required: "請輸入使用者名稱稱"
                    }
                }
            });
        });

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15

2.呼叫方式，呼叫valid()方法

校驗通過則返回true,不通過則false：

//提交方法
function pageSubmit() {
     if (! $("#queryForm").valid()) {
        return;
     }
    var data = $("#queryForm").serializeArray();
    $.ajax({
      url: "test.html",
      data: data,
      success: function(html){
        $("#result").append(html);
      }
   

3.html程式碼示例

 <form id="queryForm">
     <input type="text" name="userName" id="userName"/>
     <button type="button" id="btn-query" onclick="pageSubmit()">提交</button>
 </form>

• 1
• 2
• 3
• 4

通過上述方式則可以靈活控制校驗的位置。
附上外掛下載地址http://download.csdn.net/download/hanfei0000cool/9679278