Safari - 点击鼠标后无法移动+标签

Question

我有一个带有div和span元素的React应用程序，其外观和行为类似于复选框。他们的自定义onKeyPress和onClick事件处理程序以及tabIndex设置为0.

<span className="icon-unchecked"
     key={index}
     tabIndex={0}
     onKeyPress={(evt) => handleKeyPress(evt, index)}
     onClick={() => props.handleClick(index)} >
</span>

仅使用键盘时，导航按预期工作。但是，一旦我用鼠标单击其中一个复选框，我就无法使用shift + tab导航。我必须先使用tab，然后shift + tab再次开始工作。这不会影响常规＆＃34;不可聚焦＆＃34;元素，如按钮或输入。我可以用鼠标自由点击按钮或输入，然后立即使用shift + tab。只有在点击div，span，li以及默认情况下无法关注的类似元素时，才会出现不正确的行为。

这真的是个错误吗？因为在其他浏览器中它始终按预期工作。是否存在解决方案或解决方法？