表单提交必须显式设置method="post"和匹配后端的action；所有控件需有name属性，单选/多选题须为每个选项设value；下拉框和文本域不可用id替代name；提交需preventDefault并用FormData配合fetch发送，避免跳转丢失数据。

表单提交失败：没加 method="post" 或 action 属性

浏览器默认用 GET 提交，会导致问卷数据拼在 URL 里，不仅不安全，还容易被截断（URL 长度有限），后端也收不到完整数据。必须显式声明提交方式和目标地址。

• <form method="post" action="/submit"> 是最常见、最稳妥的写法；action 值要和后端接口路径一致，比如 Python Flask 写 action="/api/survey"，Node.js Express 可能是 action="/survey/submit"
• 如果只是本地测试、不连后端，action 可暂时设为 "#"，但务必保留 method="post"，否则开发者工具 Network 面板里看不到 POST 请求体，调试会误判
• 别用 onsubmit="return false" 挡住原生提交又不手动发请求——这样点提交按钮毫无反应，新手常在这里卡住

单选/多选题值传空：name 相同但漏写 value

浏览器只把带 value 的勾选项发给后端。name 是字段标识，value 才是实际值。没写 value，后端收到的就是空字符串或 undefined。

• 正确写法：<input type="radio" name="q1" value="a">选项A；错误写法：<input type="radio" name="q1">选项A（没 value，提交时该题无数据）
• 多选题（type="checkbox"）同理，每个选项都必须有独立 value，且 name 保持一致，如 name="hobbies"，后端才能按数组接收
• 注意：同一道单选题的所有 input 必须共用一个 name，写成 q1_a、q1_b 就变成多个独立字段，逻辑就乱了

下拉题和文本题被忽略：没设 name 或用了 id 替代

id 只用于 CSS 或 JS 定位，表单提交只认 name。漏写 name 的 <select> 或 <textarea>，无论用户怎么选、怎么填，后端都收不到。

Article To Html

文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。

下载

• <select name="education"><option value="bachelor">本科</option></select> —— 后端收到 education=bachelor
• <textarea name="feedback" rows="4"></textarea> —— 别写成 id="feedback"，那只是方便 JS 获取元素，不影响提交
• 如果某题可选可不填，<option value="">请选择</option> 这个空值项要放在最前，避免用户没动下拉框就直接提交，后端拿到的是上一题的残留值（浏览器有时会缓存选择）

提交后页面跳转或刷新丢失数据：没处理响应或没禁用默认行为

原生表单提交会触发页面跳转或刷新，用户看不到“提交成功”提示，也来不及校验必填项。真正在用的问卷页，几乎都要用 JS 控制流程。

立即学习“前端免费学习笔记（深入）”；

• 加 event.preventDefault() 在 submit 事件里，先拦住默认提交，再用 fetch 发请求，比如：

  form.addEventListener('submit', e => {
    e.preventDefault();
    fetch('/submit', { method: 'POST', body: new FormData(form) })
      .then(r => r.json())
      .then(data => alert('提交成功'));
  });

• FormData(form) 能自动收集所有带 name 的控件值，比手拼 JSON 稳定，尤其对文件上传或多选框更友好
• 别在没网络或后端挂掉时静默失败——至少加个 .catch(() => alert('提交失败，请重试'))，否则用户以为点没点上，狂点提交按钮

表单结构本身不难，真正出问题的永远是那些“看起来应该能跑”的细节：少一个 value、漏一个 name、忘了 preventDefault、或者后端期待数组却收到字符串——这些地方一错，整道题的数据就断了。