需传值用readonly，否则用disabled；readonly可复制聚焦且提交时包含值，disabled则变灰不可交互且值不提交，表格中混用会导致语义混乱和调试困难。

表格里 textarea 用 readonly 还是 disabled？

看它是否要随表单一起提交：需要传值就选 readonly，否则用 disabled。表格本身不改变这两个属性的行为，但容易因嵌套结构忽略表单上下文——比如 textarea 在 里，却忘了它仍是表单控件。

• readonly：文本可见、可复制、可聚焦（Tab 键能进）、值会出现在 FormData 或 query string 中
• disabled：变灰、无法聚焦、不能复制、提交时直接被跳过——后端收不到这个字段
• 别在表格里混用：同一列有的 readonly、有的 disabled，视觉和语义都不统一，调试时极易漏查

动态设置表格中 textarea 不可编辑的 JS 写法

直接改 .readonly 或 .disabled 属性就行，但要注意 DOM 已存在且已渲染。常见错误是操作了错误的元素引用，或没等表格加载完就执行脚本。

• 获取目标 textarea 推荐用 document.querySelector('table#myTable textarea[name="remark"]')，比遍历 rows/cells 更可靠
• 设为只读：el.readonly = true；设为禁用：el.disabled = true（注意不是 el.setAttribute('disabled', 'true')）
• 切换后建议同步 aria-readonly 或 aria-disabled，例如：el.setAttribute('aria-readonly', 'true')
• 如果表格由 Vue/React 渲染，不要直接操作 DOM，改用响应式数据驱动，比如 Vue 模板写

为什么表格里的 textarea 看似不可编辑，但提交时值丢了？

大概率是用了 disabled 却误以为“只是锁住”，而 HTML 规范明确要求：所有 disabled 表单控件的值都不会参与序列化。这在表格场景下尤其隐蔽——UI 上看着只是“灰了”，没人想到后端根本收不到。

Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转

实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。

下载

• 用 Chrome DevTools 的 Elements 面板右键检查，确认属性是 readonly 还是 disabled，不是拼错成 read-only 或 disable
• 在控制台运行 new FormData(document.querySelector('form'))，展开看字段是否存在
• CSS 里若写了 pointer-events: none 或 user-select: none，也会导致视觉可读但实际无法交互，但这不影响提交——仅干扰用户操作
• 如果必须视觉禁用又得传值，宁可用 readonly + CSS 模拟禁用态：background: #f9f9f9; border-color: #ddd; cursor: default;

表格中替代方案：contenteditable="false" 能用吗？

能，但不推荐用于表单数据采集场景。它只是让任意元素（比如

或 ）变成不可编辑文本块，但它不是表单控件，不会自动加入 FormData，也不会响应 name 属性提交。

• 适合纯展示：比如表格某列显示日志摘要、状态说明等非输入型内容
• 若硬要让它参与提交，得手动把 textContent 取出来塞进隐藏 ，增加维护成本
• 无障碍支持弱于原生 textarea，屏幕阅读器可能无法正确识别其语义
• 移动端光标行为不稳定，部分 Android 浏览器会意外触发软键盘

表格里文本域是否可编辑，本质是表单语义问题，不是样式问题。最容易被忽略的是：开发时只盯着“能不能输”，却没验证“输进去的值到底有没有发出去”。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！