表单必须设置name属性才能提交数据，id/class无效；单选组用相同name，多选框name加[]；textarea加wrap="soft"保留换行；required和type仅作前端体验校验，后端仍需完整验证；提交按钮须为type="submit"，form需指定action和method。
表单必须包含 name 属性才能提交数据
浏览器只把带 name 的表单控件值发给后端，id 或 class 不起作用。漏写 name 是最常导致“表单看起来提交了，但后端收不到任何字段”的原因。
实操建议：
立即学习“前端免费学习笔记（深入）”；
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
-
<input type="text" name="email">—— 不是id="email" - 单选组（
radio）所有选项用相同name，比如name="priority" - 多选框（
checkbox）若需多个值，name后加[]（如name="features[]"），PHP/Node.js 等后端才识别为数组
textarea 默认无换行，需用 wrap="soft" 保留用户输入格式
用户在 textarea 中按 Enter 换行，但如果不设属性，提交后可能变成空格或被截断。HTML 默认不保留换行，后端收到的是纯文本流，换行符是否生效取决于后端处理逻辑。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 加
wrap="soft"让浏览器在显示时换行，同时提交原始换行符（\n） - 避免用
wrap="hard"—— 它会强制在超长行末插入\n，干扰用户真实输入 - 配合
rows="4"控制初始高度，比用 CSSheight更可靠
用 required 和 type="email" 做基础校验，但别依赖前端
这些属性能触发浏览器原生提示（如“请填写电子邮件地址”），但绕过非常容易：禁用 JS、手动改 HTML、用 curl 提交。它们只是体验优化，不是安全防线。
实操建议：
立即学习“前端免费学习笔记（深入）”；
-
<input type="email" required>会阻止空提交并校验基本邮箱格式 -
<select required><option value="">请选择</option></select>—— 第一个option的value必须为空，否则required不生效 - 后端仍需完整校验：邮箱域名是否存在、手机号长度、文本长度限制等
提交按钮必须是 type="submit"，且表单要有 action 和 method
写成 <button>提交</button> 默认是 type="submit"，但显式声明更稳妥；如果漏掉 action，表单会提交到当前 URL，容易 404 或覆盖页面；method 不写默认是 GET，但反馈内容含敏感信息或较长文本时必须用 POST。
实操建议：
立即学习“前端免费学习笔记（深入）”；
<form action="/feedback" method="POST"><button type="submit">提交反馈</button>- 避免用
<input type="button">—— 它不会触发表单提交，除非配 JS
<form action="/feedback" method="POST">
<label>邮箱：<br><input type="email" name="email" required></label><br>
<label>反馈内容：<br><textarea name="message" rows="4" wrap="soft" required></textarea></label><br>
<label>优先级：<br>
<input type="radio" name="priority" value="low"> 低
<input type="radio" name="priority" value="medium" checked> 中
<input type="radio" name="priority" value="high"> 高
</label><br>
<button type="submit">提交</button>
</form>
真正容易被忽略的点：后端接收时，textarea 的换行在不同环境里可能是 \n、\r\n 或被 trim 掉开头结尾空格 —— 别假设它和你敲的一模一样。 
