1 自定義校驗規則代碼

<script type="text/javascript">
    //使用validate插件進行表單的校驗
    $(function(){
        $("#myform").validate({
            rules:{
                checkCode:{
                    "required":true,
                    "checkVerificationCode":true
                }
                
            },
            messages:{
                checkCode:{
                    
 
"required":"驗證碼不能為空",
                    "checkVerificationCode":"驗證碼輸入錯誤"
                }
            }
        });
    });


    //自定義校驗規則校驗驗證碼是否正確
    $.validator.addMethod(
        //規則的名稱
        "checkVerificationCode",
        //校驗的函數
        function(value,element,params){
            
            
 
//定義一個標誌
            var isTrueFlag= false;
            
            
            //value:表單輸入框中輸入的內容
            //element:被校驗的元素對象
            //params：規則對應的參數值
            //目的：對輸入的checkCode進行ajax校驗
            $.ajax({
                "async":false,/*必須要是同步的的方式  */
                "url":"${pageContext.request.contextPath}/checkVC
 
",
                "data":{"checkCode":value},
                "type":"POST",
                "dataType":"json",
                "success":function(data){
                    isTrueFlag = data.isTrue;
                    /* alert(isTrueFlag); */
                }
                
            });
            
            //返回false代表該校驗器不通過
            return isTrueFlag;
        }
    
    );
   
</script>

2 servlet代碼

package www.test.web.servlet;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class CheckVCServlet extends HttpServlet {

    public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        // 解決亂碼問題
        request.setCharacterEncoding("UTF-8");

        // 判斷驗證碼是否正確
        // 獲得頁面輸入的驗證
        String checkCode_client = request.getParameter("checkCode");
        System.out.println(checkCode_client);
        // 獲得生成圖片的文字的驗證碼
        String checkCode_session = (String) request.getSession().getAttribute("checkcode_session");
        System.out.println(checkCode_session);
        // 比對頁面的和生成圖片的文字的驗證碼是否一致
        boolean isTrue=true;
        if (!checkCode_session.equals(checkCode_client)) {
            isTrue=false;
        }
        String json ="{\"isTrue\":"+isTrue+"}";
        
        response.getWriter().write(json);
    }

    public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
    }

}

註意：表單校驗不通過的時候不會提交。

案例17-validate自定義校驗規則校驗驗證碼是否輸入正確