表单必须设method="post"和正确action，name属性不可缺，提交按钮需type="submit"，移动端优先用语义化type和inputmode优化键盘。
表单结构用 <form></form> 包裹，method 和 action 必须设对
用户点“提交”后数据发给谁、怎么发，全靠这两个属性。不写 method 默认是 GET，但报名信息含姓名、电话、邮箱等敏感内容，必须用 POST；action 指向后端接收地址，本地测试可先设为 "#" 或留空，避免跳转报错。
常见错误：漏写 method="post" 导致参数拼在 URL 里，或 action 写成绝对路径却没部署后端，点提交后 404 或刷新空白页。
-
<form method="post" action="/api/apply"></form>（上线时指向真实接口） - 本地调试可用
action="#"，配合浏览器控制台看submit事件是否触发 - 别用
action="javascript:void(0)"—— 屏蔽默认行为但没补 JS，提交就失效
必填字段加 required，但得配 name 才能传值
HTML 表单提交只发送带 name 属性的控件值。required 只负责前端校验，不加 name 就算填了也传不出去。
典型翻车现场：写 <input type="text" required placeholder="姓名">，结果后端收不到 name 字段。
立即学习“前端免费学习笔记（深入）”；
- 姓名：
<input type="text" name="name" required> - 手机号：
<input type="tel" name="phone" required pattern="[0-9]{11}">（pattern做简单格式限制） - 邮箱：
<input type="email" name="email" required>（浏览器自动校验邮箱格式） - 选项类用
<select name="event"></select>或<input type="radio" name="attend" value="yes">，注意同组name相同
按钮必须是 type="submit"，别用 button 或 div
很多新手用 <button>提交</button> 或 <div onclick="...">，结果按回车没反应、点按钮不触发表单提交——因为默认 <code><button></button> 是 type="button"，只是普通按钮。
回车提交是表单基础体验，尤其移动端用户习惯直接按键盘回车，这点不能丢。
- 正确写法：
<button type="submit">立即报名</button> - 如果要加 loading 状态，JS 里监听
submit事件，调用event.preventDefault()后再发请求，别直接干掉提交逻辑 - 禁用状态用
disabled属性，而不是 CSS 隐藏或 JS 移除点击事件
移动端输入体验差？优先用语义化 type 和 inputmode
在手机上，<input type="text"> 弹出的是全键盘，但手机号应该弹数字键盘，邮箱应该带 @ 键。不用 JS 就能优化。
安卓和 iOS 对 inputmode 支持已很稳定，比单纯靠 type 更精准。
- 手机号：
<input type="tel" inputmode="numeric" pattern="[0-9]*"> - 验证码：
<input inputmode="decimal" maxlength="6"> - 邮箱：
<input type="email" inputmode="email"> - 避免滥用
type="number"——它会校验并可能把 "00123" 转成 "123"，丢失前导零
表单看似简单，但用户从点开到填完的每一步，都卡在某个属性没写对、某个类型选错、或者以为写了 required 就万事大吉。最常被忽略的是 name 和 type="submit"，这两处一漏，后端连日志都收不到。
