disabled 的 textarea 值不提交，readonly 才能提交且禁编辑；需配 CSS 实现灰化，禁用时务必用 disabled 而非仅样式，fieldset disabled 可批量控制但 form 不支持。
textarea 加 disabled 属性就变灰，但值不提交
直接在 textarea 标签上加 disabled 属性，浏览器会自动灰化、禁用聚焦和输入，且表单提交时完全忽略该字段。这是最轻量、语义最正确的做法。
常见错误是误以为“灰色 = 只读”，结果后端收不到数据。记住：disabled 的 textarea 值不会出现在 FormData、serialize() 或原生表单 POST 中。
-
<textarea name="remark" disabled>初始内容</textarea>→ 灰色、不可编辑、不提交 - 若需提交值但禁止修改，请改用
readonly（支持textarea） - 别写
disabled="false"或disabled=""—— 只要属性存在，就禁用
想变灰又保留提交，必须用 readonly 而非 disabled
readonly 对 textarea 完全有效，它允许用户聚焦、复制、选中文本，值照常提交，但不能编辑。视觉上默认不灰，所以需要配合 CSS 强制变灰。
如果不加样式，用户可能误点进去试图修改，却没反应——这比 disabled 更难察觉问题。
立即学习“前端免费学习笔记（深入）”；
- HTML：
<textarea name="id" readonly>ABC123</textarea> - CSS：
textarea[readonly] { background: #f5f5f5; color: #666; cursor: not-allowed; } - 注意：不要同时加
disabled和readonly——disabled优先级更高，readonly会被忽略
用 CSS 模拟 disabled 效果容易踩的坑
有人为绕过 disabled 不提交的问题，尝试纯 CSS 实现“看起来禁用”：比如加 pointer-events: none、opacity: 0.6、background: #eee。这种写法看似灵活，实则危险。
它只骗过了眼睛，没骗过浏览器行为：元素仍可聚焦、仍响应键盘输入（如 Tab 进入后按 Backspace 可能删内容）、屏幕阅读器仍会朗读、移动端 touch 事件可能意外触发、表单序列化仍包含它的值。
- 绝对避免：
<textarea style="pointer-events:none; opacity:0.6;"></textarea> - 如果必须用 JS 控制交互逻辑，也请同步设置
textarea.disabled = true，而不是只靠样式 - 自定义禁用状态时，务必补上
aria-disabled="true"和tabindex="-1"才算基本可访问
fieldset 包裹 textarea 后禁用，效果等同于直接 disabled
把 textarea 放进 fieldset，再给 fieldset 加 disabled，其内部所有可交互控件（包括 textarea）都会被统一禁用。效果和直接在 textarea 上加 disabled 一致，且值同样不提交。
这个技巧适合批量控制一组字段，但要注意：legend 文字不受影响，仍可点击；如果想让整个区域（含标题）都视觉弱化，得额外加 CSS。
- 有效写法：
<fieldset disabled> <legend>备注</legend> <textarea name="note"></textarea> </fieldset> - 无效写法：
<form disabled><textarea></textarea></form>——form元素根本不支持disabled属性 - JS 动态控制：
document.querySelector('fieldset').disabled = true即可启用/禁用整块
readonly + 三行 CSS。 
