表单字段校验应使用防抖延迟触发，仅对非空、最小长度、基础格式等轻量项做300ms防抖检查；异步请求、复杂正则、跨字段逻辑等不适合防抖处理。
表单字段校验用防抖延迟触发，核心是避免用户每敲一个字就验证——既干扰输入，又浪费资源。关键不在“能不能防抖”，而在于“什么时候该防抖、防多久、怎么防才不误事”。
input 事件里加防抖，只做轻量检查
用户在输入框中打字时，input 事件高频触发。直接在里面跑完整校验（比如复杂正则匹配邮箱、查用户名是否可用）会卡顿、误报。正确做法是：只检查明显问题，且加 300ms 防抖。
- 适合防抖后检查的项：非空、最小长度（如密码至少6位）、基础格式（如手机号开头是否为1）
- 不适合放这里的：异步请求（如用户名唯一性）、超长中文邮箱正则、依赖其他字段值的逻辑（如确认密码）
- 代码示意：
const debouncedCheck = debounce(() => {
if (input.value.trim().length else clearError();
}, 300);
input.addEventListener('input', debouncedCheck);
blur 时机更适合语义和异步校验
用户离开输入框（比如点到下一个字段或点提交），说明当前字段“暂告一段落”。这时再做需要完整值或需发请求的校验更合理，也天然避开“输一半就报错”的尴尬。
deep-java-review
下载
Java项目代码review工具。分析Git变更+完整调用链路上下文，推断业务需求，进行多维度评分和分类汇总，生成完整PRD文档。包含细粒度Java代码审查清单（Null安全、异常处理、Streams、并发、equals/hashCode、资源管理、API设计、性能、MyBatis/ORM、事务边界、SQL/DD...
- 先判空：
if (!value.trim()) return;，避免空值触发后端查询 - 异步校验要加 loading 状态，并用
AbortController取消上一次未完成的请求 - 后端返回错误建议带
field字段，前端可精准定位并提示，例如：
{ "field": "email", "message": "该邮箱已被注册" }
防抖函数本身要可靠，支持立即执行可选
不是所有防抖都一样。简单 setTimeout + clearTimeout 能应付多数场景，但要注意 this 和参数传递；如果希望“第一次输完立刻验、之后等停顿再验”，就得用带 immediate 参数的版本。
- 基础版够用：
debounce(fn, 300)—— 用户停顿 300ms 后执行 - 进阶需求（如搜索联想首字即查）：
debounce(fn, 300, true)—— 首次触发立刻执行，后续触发按规则防抖 - 别漏掉清理：防抖函数返回的闭包内必须用
clearTimeout清前序定时器，否则会堆积
submit 是最终防线，不能省略
不管 input 和 blur 做得多细，用户仍可能绕过（比如粘贴后直接点提交、禁用 JS 后手动改 DOM）。所以 submit 事件里必须做一次完整同步校验，并 event.preventDefault() 阻止默认提交。
- 这里可以汇总所有字段状态，统一高亮错误、滚动到首个问题字段
- 同时禁用提交按钮，防止重复点击（配合节流更稳妥）
- 不推荐把全部校验逻辑堆在 submit 里——体验滞后，用户不知道哪错了，得靠 blur 和 input 提前反馈
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
