表单校验
Form Validation
交互模式也叫：表单验证、输入校验、校验规则
一句话：检查用户填写的内容是否符合要求，比如必填、手机号格式、密码长度，不符合时给出具体提示。
详细解释
表单校验分前端校验和后端校验。前端校验在浏览器里即时检查，体验好；后端校验防止有人绕过前端，必须有。给 AI 提需求时两者都要提。
前端校验要定好「什么时候校验」：输入过程中实时校验，容易在用户还没输完时就报错；通常更好的时机是输入框失去焦点时校验一次，之后再修改时实时更新；点击提交时再整体校验一遍，并把页面滚动到第一个出错的字段。
错误提示放在对应输入框的正下方，说清楚要求（「密码至少 8 位，需包含数字」），出错的输入框边框变红。不要只在顶部显示一句「表单有误」。
示例
灰度线框示意，只表达结构，不代表具体视觉风格。
怎么跟 AI 说
可以直接贴给 Cursor、Claude Code 等工具，把里面的业务内容换成你自己的。
注册表单加校验：手机号必须是 11 位数字，密码至少 8 位且包含字母和数字，两次密码要一致；每个字段失去焦点时校验，错误信息显示在输入框下方并把边框变红；点击提交时校验全部字段，并滚动到第一个出错的位置。