Question

使用键盘导航表单时，按钮元素不会在Safari中获得焦点（在Yosemite的v8.0中测试）。这是除非在首选项 - ＆gt;下显式转换标签。高级。有没有办法解决这个问题？

＆＃13;

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <form action="">
    <fieldset>
      <input type="text" />
      <button>Button</button>
      <input type="text" />
      <button type="button">Button</button>
    </fieldset>
  </form>
</head>
<body>
  
</body>
</html>

＆＃13;

http://codepen.io/alexandtheweb/pen/raQrxw

Answer 1

没有办法解决这个问题。用户需要启用这些首选项才能使标签正常工作。

Answer 2

Safari行为与其他浏览器完全不同。默认情况下，您可以使用＆＃34;选项（/ Alt）+ Tab＆＃34;来关注所有可点击元素。捷径。除非启用了您提及的选项，否则选项卡仅会聚焦文本字段。

例如，请参阅以下帮助页面，＆＃34;突出显示网页上的下一个项目＆＃34;部分。 https://support.apple.com/kb/PH17148?locale=en_US

Answer 3

如果你使用jquery，这里有一个快速修复：

$('body').on('keydown',function(e){
    if (e.keyCode == 9){
        var $focused = $(':focus');
        var inputs = $('input:not([type="hidden"]),select,textarea,button');
        inputs.eq(inputs.index($focused[0])+1).focus();
        e.stopPropagation();
        e.preventDefault();
        return false;
    }
});

将tabindex / focus添加到Safari中的按钮，而不更改默认浏览器首选项

3 个答案: