什么是 jQuery 中的非侵入式验证？

在 Web 开发中，表单验证是非常重要的一环。而 jQuery 提供了非常便捷的表单验证插件。其中，非侵入式验证则是一个核心概念。

什么是非侵入式验证？

非侵入式验证指的是通过自定义属性来实现表单验证，而不是直接修改表单元素的属性或者 DOM 结构。这样做有以下优势：

1. 简化代码：不需要修改表单元素的属性或者 DOM 结构，代码量更少。
2. 更灵活：可以根据具体需求自定义验证规则和错误提示信息。

实现方式

借助 jQuery 的 validate 插件，非侵入式验证通过在表单元素上添加自定义属性，指定验证规则和错误提示信息。

以常见的文本框为例，通过在 input 标签上添加 data-rule 和 data-msg 属性来指定验证规则和错误提示信息。

<form>
  <input type="text" name="username" data-rule="required" data-msg="用户名不能为空">
</form>

在 jQuery 脚本中，使用 validate() 方法来初始化表单验证，并定义验证规则和错误提示信息：

$('form').validate({
  rules: {
    username: {
      required: true
    }
  },
  messages: {
    username: {
      required: '用户名不能为空'
    }
  }
});

这样，当用户提交表单时，jQuery validate 插件会自动根据 data-rule 和 data-msg 属性进行验证，并显示相应的错误提示信息。

总结

非侵入式验证是 jQuery validate 插件的核心概念之一，通过自定义属性来指定验证规则和错误提示信息，实现代码简洁、灵活的表单验证。