jquery validate自訂驗證怎麼用

jquery validate自訂驗證步驟：1、引入jQuery庫和jQuery validate插件庫；2、編寫HTML表單程式碼，並為需要驗證的欄位新增class和自訂的驗證規則；3、在JavaScript中初始化validate插件，並新增自訂驗證方法；4、

#使用jQuery validate自訂驗證的步驟如下：

1.引入jQuery庫和jQuery validate插件庫。

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>

2. 編寫HTML表單程式碼，並為需要驗證的欄位新增class和自訂的驗證規則。

<form id="myForm">
<input type="text" name="username" class="required">
<input type="text" name="age" class="required customNumber">
<input type="submit" value="Submit">
</form>

3. 在JavaScript中初始化validate插件，並新增自訂驗證方法。

$(document).ready(function () {
// 验证规则
$.validator.addMethod("customNumber", function (value, element) {
return /^[-+]?(\d+|\d+\.\d*|\d*\.\d+)$/.test(value);
}, "请输入有效的数字");
// 初始化validate插件
$("#myForm").validate();
});

4. 可選：自訂驗證錯誤提示訊息。

$(document).ready(function () {
// 自定义错误提示信息
$.extend($.validator.messages, {
required: "该字段不能为空",
customNumber: "请输入有效的数字"
});
// 初始化validate插件
$("#myForm").validate();
});

現在，當使用者提交表單時，jQuery validate會自動驗證每個欄位是否符合規則，並顯示對應的錯誤訊息。自訂驗證方法會根據自訂驗證規則進行驗證，並顯示自訂的錯誤訊息

以上是jquery validate自訂驗證怎麼用的詳細內容。更多資訊請關注PHP中文網其他相關文章！