表格中textarea的autofocus失效并非因表格本身,而是因元素未渲染、不可见、被禁用或不在允许自动聚焦的上下文中;手动focus需确保DOM就绪、元素可见且避开SSR/移动端陷阱。

autofocus 在 <textarea></textarea> 上基本可用,但表格(<table>)本身不参与焦点管理——真正决定能否聚焦的是 <code><textarea></textarea> 是否已渲染、可见、未被禁用,以及是否处于浏览器允许自动聚焦的上下文中。
为什么表格里的 textarea 加了 autofocus 却没反应?
常见原因不是“表格导致失效”,而是以下任一条件未满足:
-
<textarea></textarea>被包裹在display: none或visibility: hidden的<td>/<code><tr> 里 —— 浏览器会跳过 autofocus <li>表格是 JS 动态插入的(比如 <code>innerHTML += '<table>...</table>'),DOM 解析完成时该<textarea></textarea>还不存在 - 页面用了 CSS 框架(如 Bootstrap)的折叠/模态逻辑,实际靠
class="d-none"控制显隐,但autofocus不感知 class 变化 - 多个
<textarea></textarea>都写了autofocus,浏览器只认第一个,且可能被后续 JS 的.focus()覆盖 - 确保 DOM 已就绪:
document.addEventListener('DOMContentLoaded', () => { ... })或脚本放在
textarea.focus() 怎么写才真正生效?
手动聚焦比依赖 autofocus 更可控,尤其在表格场景下。关键不是“调用 focus”,而是“在对的时机、对的状态下调用”:



















