这是个很常见的跨浏览器兼容性问题，尤其是Safari在DOM事件和表单交互上的行为经常和Chrome/Firefox有差异。结合你的场景，我梳理了几个最可能的原因：

• 输入事件触发时机的浏览器差异
  Chrome和Firefox通常在用户完成输入动作（比如按键抬起）后才会触发输入框的onChange/onInput事件，但Safari会在按键按下的更早阶段就触发这些事件。如果你的代码里存在「在第一个输入框的输入事件中主动切换焦点到第二个输入框，并同步值」的逻辑，Safari的提前触发会导致这个逻辑被非预期执行，而其他浏览器因为触发时机晚，不会出现这个问题。

• React合成事件的Safari兼容性瑕疵
  React的合成事件虽然致力于抹平浏览器差异，但Safari在处理输入框onChange事件时，事件对象的属性更新（比如target.value）或事件冒泡的时机和其他浏览器不一致。举个例子：当你在第一个输入框输入内容时，React在Safari中可能还没完成第一个输入框的状态更新，就执行了切换焦点和同步值的逻辑，导致第二个输入框意外获取值和焦点。

• Safari原生表单智能功能的干扰
  Safari自带表单自动填充、自动修正甚至「关联字段智能输入」的功能，如果它判定你的两个输入框是关联字段（比如尺寸的宽高），可能会自动帮用户同步内容并切换焦点。这种情况下，你可以尝试给输入框添加autocomplete="off"、autocorrect="off"或autocapitalize="off"属性，禁用这些原生智能功能后再测试。

• 焦点管理逻辑的潜在漏洞
  如果你是通过监听onKeyDown事件判断按键（比如回车、Tab）来切换焦点，Safari对部分按键的事件处理（比如keyCode取值、事件传递顺序）和其他浏览器不同，可能导致非预期的焦点切换。另外，React的协调机制在Safari中渲染输入框时，若第一个输入框的value更新触发了重渲染，也可能意外触发焦点转移。

快速排查建议 #

1. 在第一个输入框的事件处理函数中添加console.log，打印事件类型、target.value、当前焦点元素，对比Safari和Chrome的输出差异，定位触发时机的不同；
2. 暂时注释掉同步值和切换焦点的逻辑，看问题是否消失，确认是逻辑触发还是原生行为导致；
3. 给两个输入框添加autocomplete="off"等禁用智能功能的属性，排除Safari原生干扰。

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