jQuery：validate添加自定義驗證

時間 2019-11-08

原文原文鏈接

jQuery.validator.addMethod添加自定義的驗證規則javascript

addMethod：name, method, messagephp

簡單實例：單個驗證的添加html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>validate.js拓展驗證</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript" src="validate.expand.js"></script>
</head>
<body>
<form action=""  method="get" id="tinyphp">
<input type="text" value="" name="isZipCode" />
<input type="submit" value="提交" />
</form>
<script type="text/javascript">
$("#tinyphp").validate({
    // 添加驗證規則
    rules: {
        isZipCode: {    //驗證郵箱
            isZipCode: true
        }
    }
});  
    </script>
</body>
</html>

validate.expand.jsjava

jQuery.validator.addMethod("isZipCode", function(value, element) {   
    var tel = /^[0-9]{6}$/;
    return this.optional(element) || (tel.test(value));
}, "請正確填寫您的郵政編碼");

多個驗證方法添加，請下載實例>>>>jquery

=========================================================================ajax

或看下面：api

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>validate.js拓展驗證</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript" src="validate.expand.js"></script>
</head>
<body>
<form action=""  method="get" id="tinyphp">
郵編：<input type="text" value="" name="isZipCode" /><br /><br />

名字：<input type="text" value="" name="userName" />
<input type="submit" value="提交" />
</form>
<script type="text/javascript">
$("#tinyphp").validate({
    // 添加驗證規則
    rules: {
        isZipCode: {    //驗證郵箱
            isZipCode: true
        },
        userName:{
            required: true,
            userName: true,
            rangelength: [5,10]    
        }
    },
    
    //重設提示信息,可省略
    messages:{
        userName: {
            required: "請填寫用戶名",
            rangelength: "用戶名必須在5-10個字符之間" 
        }       
    
    }
});  
    </script>
</body>
</html>

validate.expand.jsui

jQuery.validator.addMethod("userName", function(value, element) {
    return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);
}, "用戶名必須在5-10個字符之間");   

jQuery.validator.addMethod("isZipCode", function(value, element) {   
    var tel = /^[0-9]{6}$/;
    return this.optional(element) || (tel.test(value));
}, "請正確填寫您的郵政編碼");

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。