HTML TextArea仅Safari浏览器不可编辑其他浏览器正常问题求助

1. 核心原因：draggable="true"属性的Safari兼容性冲突 #

你提供的textarea代码中设置了draggable="true"，这是触发问题的最直接原因：

• Safari的WebKit内核对设置了可拖拽属性的输入类元素（textarea、input等）的事件处理逻辑和Chrome等浏览器不同，会优先将交互事件分配给拖拽逻辑，阻断正常的文本输入事件传递，导致元素看起来不可编辑。
• 切出标签页再切回仅能输入1个字符的现象也和该逻辑有关：切页返回时元素会临时获得输入焦点，但第一个输入事件触发后，WebKit的拖拽事件监听器会立刻重新抢占事件优先级，再次阻断后续所有输入操作。

2. 其他可能的触发原因 #

如果移除draggable属性后问题仍然存在，可排查以下两点：

• 有没有全局绑定的keydown/beforeinput/keypress事件监听器错误阻断了输入事件，Safari对事件冒泡和默认行为阻止的判定规则比Chrome更严格，不符合规范的e.preventDefault()或return false逻辑更容易误拦截表单输入。
• 检查form__text_area类的CSS属性，有没有错误设置user-select: none或者-webkit-user-select: none，Safari对该属性的作用范围会覆盖输入类元素的文本输入能力，Chrome等浏览器会针对表单元素自动豁免该规则。

• 若不需要拖拽功能：直接删除textarea标签上的draggable="true"属性即可恢复正常输入。
• 若需要保留拖拽能力：不要将draggable属性直接加在textarea上，在外层套一个div容器，将draggable="true"加在容器上即可同时实现拖拽和正常输入。

内容的提问来源于stack exchange，提问作者LarryYourWaiter