jQuery Validate 是一個用于表單驗證的 jQuery 插件。要設置驗證規則,請遵循以下步驟:
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/jquery.validate.min.js"></script>
name
和 id
屬性。例如:<form id="myForm">
<label for="username">用戶名:</label>
<input type="text" name="username" id="username">
<br>
<label for="email">郵箱:</label>
<input type="email" name="email" id="email">
<br>
<input type="submit" value="提交">
</form>
validate()
方法。為了設置驗證規則,您需要傳遞一個包含驗證規則的選項對象。例如,要設置用戶名字段不能為空且長度不能超過 20 個字符,以及郵箱字段必須是有效的電子郵件地址,可以這樣做:$(document).ready(function() {
$("#myForm").validate({
rules: {
username: {
required: true,
maxlength: 20
},
email: {
required: true,
email: true
}
},
messages: {
username: {
required: "請輸入用戶名",
maxlength: "用戶名不能超過 20 個字符"
},
email: {
required: "請輸入郵箱地址",
email: "請輸入有效的電子郵件地址"
}
}
});
});
在這個例子中,我們為 username
和 email
字段設置了 required
規則,分別表示這兩個字段是必填項。同時,我們還為 username
字段設置了 maxlength
規則,限制其長度不能超過 20 個字符。對于 email
字段,我們設置了 email
規則,以確保輸入的是有效的電子郵件地址。
您還可以使用其他內置的驗證規則,或者自定義驗證規則。只需將相應的規則添加到 rules
對象中即可。同時,可以使用 messages
對象自定義驗證失敗時的錯誤提示信息。