加 required 属性即可实现前端密码必填校验，但需确保按钮 type="submit"、避免框架封装干扰、且必须配合后端空值检查。
密码输入框加 required 就够了
HTML5 中，给 加上 required 属性，表单提交时浏览器会自动阻止空值提交，并弹出提示（如“请填写此字段”）。不需要 JavaScript 或额外验证逻辑。
为什么有时加了 required 还没反应？
常见原因不是属性写错了，而是表单触发机制没对上：
-
required只在用户主动提交表单（比如点击或回车）时生效，单纯失去焦点（blur）不会触发校验 - 如果按钮是
但没写type="submit"，它默认是type="button"，不触发表单提交，required就不会起作用 - 某些 UI 框架（如 Ant Design、Element Plus）封装了原生
input，可能屏蔽了原生校验，此时需用框架自己的表单规则 - Chrome 等浏览器对自动填充的密码字段（尤其是被密码管理器填入的）可能跳过
required校验，属已知行为，非 bug
required 和后端验证必须同时存在
前端 required 只是用户体验层防护，不能替代服务端校验：
- 用户可禁用 JS、删掉
required属性、或用 curl/postman 绕过表单直接发空值 - 后端收到请求后，仍需检查
password字段是否为空字符串或仅空白字符（如"\t\n "） - 建议后端用严格判空：例如 Python 的
if not password or not password.strip():，而非只判if not password:
想自定义提示文字？原生不支持，得换思路
浏览器对 required 的提示文案（如“请填写此字段”）不可通过 HTML 属性修改。若需中文或更明确提示：
立即学习“前端免费学习笔记（深入）”；
- 用
setCustomValidity()+oninvalid手动设提示，但会覆盖原生校验逻辑，需小心维护 - 更稳妥的做法是保留
required，再加一个提示文本：“密码为必填项”，放在输入框下方 - 若用现代框架（React/Vue），推荐结合
useState或v-model做实时反馈，比依赖原生提示更可控
type="submit"，也别指望浏览器提示能翻译成“请输入密码”——那是后端返回错误或前端 JS 控制的范畴。 
