当从页面底部到顶部进行选项卡时，焦点会丢失在导航栏后面

Question

对于我们的Intranet网站，我们使用位于浏览器顶部固定位置的bootstrap nav bar。在此特定页面上，使用将要在两列输入字段中水平制表。

铬

但是，在Chrome中，当用户从一列底部到下一列的顶部时，浏览器会通过将滚动条移动到最顶部来容纳用户，从而允许用户查看焦点所在的字段目前正在上线。这是一个显示我的意思的屏幕截图：

Internet Explorer

然而，在IE中（版本8,9和10），输入字段被移动到浏览器的顶部并在导航栏后面丢失，如下所示：

当焦点设置在第二列的顶部输入字段时，是否有一种方法可以语法调整IE滚动条的位置？

Answer 1

如果将类first-input应用于导致此问题的每个输入，则此JS / jQuery代码可能会有所帮助。

$(window).keyup(function(event) {              // Catch all keyboard events
  if (event.keyCode == 9) {                    // We only care about the TAB Key
    var $activeEl = $(document.activeElement); // Get the currently focused element
    if ($activeEl.hasClass('first-input')) {   // If the element is a first-input...
      console.log("We hit a first-input, adjust scroll.");
      $(window).scrollTop($(window).scrollTop() - 50);     // Adjust scroll
    }                                                      // You can increase the number
  }
});

可能有一种方法可以检查它是否是第一个输入（除了使用硬编码的类名） - 但这是最​​快的想法。