发帖表单必须包含name="title"和name="content"字段才能被后端识别，因flask、express、php等轻量后端仅通过name属性接收数据；缺name或拼错则request.form为空，且textarea需用name="content"保留换行。
发帖表单必须包含哪些 name 字段才能被后端识别
大多数轻量后端（如 Flask、Express 或 PHP 的 $_POST）靠表单控件的 name 属性接收数据，不是 id 也不是 class。漏写或拼错 name，后端收不到值，连调试都找不到源头。
典型字段组合如下，按实际需求取舍：
-
<input name="title">—— 帖子标题，必填，通常限制长度（如 100 字） -
<textarea name="content"></textarea>—— 正文，用textarea而非input，否则换行丢失 -
<input name="author" value="guest">—— 作者名，可预填或由登录态注入，不建议仅靠前端传（需后端校验） -
<input type="hidden" name="timestamp" value="1717023456">—— 时间戳建议后端生成，前端仅作备用或用于防重复提交
textarea 换行和空格在 HTML 中为何显示异常
浏览器默认会把连续空白符（空格、制表、换行）压缩成一个空格，textarea 的值虽保留换行符（\n），但渲染到页面时若直接用 innerHTML 插入，这些 \n 不会变成 <br>，导致所有文字挤成一行。
解决方法取决于你如何展示帖子内容：
- 服务端渲染：PHP/Python 输出前用
nl2br()或str_replace("\n", "<br>", $text) - 前端 JS 渲染：对
content值做处理，例如text.replace(/\n/g, "<br>")
，再赋给innerHTML - CSS 方案（仅限展示层）：
white-space: pre-line，但注意它不处理 XSS，不能替代转义
⚠️ 切勿直接把用户输入的 content 用 innerHTML 插入而不转义 —— 这是 XSS 高危操作。
用纯 HTML + localStorage 模拟发帖，为什么刷新后数据消失
localStorage 确实能存，但常见错误是只存了字符串，没存结构化数据，或者读写时机不对。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
关键点：
- 存之前必须
JSON.stringify()，例如：localStorage.setItem("posts", JSON.stringify(postsArray)) - 读出来必须
JSON.parse()，否则得到的是字符串而非数组，.push()会失败 - 每次新增帖子，要先
JSON.parse()旧数据 →.push(newPost)→JSON.stringify()再存回 - localStorage 容量约 5MB，但单条帖子别存太大附件或 base64 图片，否则容易触发
QuotaExceededError
示例片段（简化）：
const posts = JSON.parse(localStorage.getItem("posts") || "[]");
posts.push({ title: form.title.value, content: form.content.value, time: Date.now() });
localStorage.setItem("posts", JSON.stringify(posts));
提交按钮点击后没反应？检查这三处 DOM 绑定问题
纯 HTML 页面没有框架帮你自动绑定事件，JS 必须明确找到元素并监听，常见断点位置：
- JS 代码放在
里，但 DOM 还没加载完 —— 改用DOMContentLoaded或把 script 放在前 - 用
getElementById却忘了加id="submit-btn"，或 ID 拼错；更稳妥是用querySelector('button[type="submit"]') - 表单有
onsubmit="return false;"或 JS 里写了event.preventDefault()却没后续逻辑 —— 表现就是点不动，控制台也无报错
如果只是想本地预览，又不想搭服务，最简验证方式：在按钮上加 onclick="alert('submitted')"，能弹窗说明 DOM 可触达，再逐步替换成真实逻辑。
真正上线时，发帖页的复杂度不在 HTML 结构，而在前后端信任边界怎么划——比如作者名谁来设、时间谁来定、内容过滤在哪层做。这些藏在表单背后的规则，比标签怎么写更容易出问题。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
