Bootstrap Validator 动态添加与移除校验规则详解
作者:橙子时间:2026-10-22 09:08:52浏览:439
本文介绍如何在 Bootstrap Validator 中根据业务条件动态添加或移除校验规则。通过调用 addField 方法可向指定 input 字段注入如 notEmpty 等验证器,使用 removeField 则可移除已添加的校验。掌握这两个 API 能灵活控制表单验证逻辑,提升用户体验。
Bootstrap Validator 动态添加与移除校验规则详解
初始化校验配置的核心代码如下所示。
function initValidate() {
<span style="white-space:pre"> </span>$('#detailform').bootstrapValidator({
<span style="white-space:pre"> </span>feedbackIcons : {
<span style="white-space:pre"> </span>valid : 'glyphicon glyphicon-ok',
<span style="white-space:pre"> </span>invalid : 'glyphicon glyphicon-remove',
<span style="white-space:pre"> </span>validating : 'glyphicon glyphicon-refresh'
<span style="white-space:pre"> </span>},
<span style="white-space:pre"> </span>fields : {
<span style="white-space:pre"> </span>txPassword : {
<span style="white-space:pre"> </span>validators : {
<span style="white-space:pre"> </span>notEmpty : {
<span style="white-space:pre"> </span>message : '交易密码不能为空'
<span style="white-space:pre"> </span>},
<span style="white-space:pre"> </span>notSameAndContinuity : {
<span style="white-space:pre"> </span>message : '密码必须为6位不相同、不连续的数字'
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>});
};
在实际开发中,经常需要根据特定条件动态地添加或移除校验规则。
若需添加校验,可调用 addField 方法,其中 approvalMemo 为对应 input 元素的 name 属性值。
$("#detailform").bootstrapValidator("addField", "approvalMemo", {
<span style="white-space:pre"> </span>validators: {
<span style="white-space:pre"> </span>notEmpty : {
<span style="white-space:pre"> </span>message : '审批意见不能为空'
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>});
$("#detailform").bootstrapValidator('removeField','approvalMemo');
若需移除校验,则使用 removeField 方法。
本节对上述动态校验操作进行总结。
以上内容介绍了 Bootstrap Validator 根据条件在 JS 中添加或移除校验的方法,希望能为读者提供帮助。如有疑问欢迎留言,小编会及时回复。感谢大家对本站的支持!
作者最新文章
JS脚本在App中运行报错怎么解决
2026-11-04 23:11:03
JS怎么使用padStart方法给数字补零
2026-11-04 11:12:03
JS是什么意思?JavaScript全称及基本定义
2026-11-04 08:05:29
JS 使用 toFixed(1) 保留一位小数的基本用法与注意事项
2026-11-03 18:34:57
JS字符串转整数:parseInt与Number的区别及用法
2026-11-03 17:26:54
