Question

我希望能在我遇到的问题上得到一些帮助。我想在用户按下TAB按钮之前设置一个小延迟，然后才能选择在网页上找到的下一个输入字段。这样做的原因是我正在使用AJAX构建一个订单表单字段，其中包含可扩展和可折叠的表，这些表将从用户那里获取输入。

我使用onfocusout设置它来调用一个函数，该函数将用户在离开最后一个字段后当前表下面的表扩展，并希望第一个输入字段立即自动选择。当用户通过单击它退出表的最后一个字段时，一切都正常工作，但是当从表中删除时，我认为存在问题，因为在检索下一个表之前没有要标记的字段使用AJAX显示。

如果需要，我可以提供代码，但我想我错过了一些东西，而不是在某处犯错。我们将非常感谢帮助，并且我非常乐意澄清任何不清楚的事情。谢谢！

Answer 1

所以，我已经创建了一个非常基本的例子，说明了它是如何工作的。我的示例仅考虑输入，但您可以使用代码来执行您需要的操作。

警告：防止自然浏览器行为可能会非常棘手，因此请注意可能导致的其他问题。

这是一个小提琴，展示了如何做到这一点：https://jsfiddle.net/iamjpg/wme339h9/

document.onkeydown = TabExample;

// Basic function
function TabExample(evt) {
    // Capture event
  var evt = (evt) ? evt : ((event) ? event : null);
  // Tab keycode constant
  var tabKey = 9;
  // If key is tab...
  if (evt.keyCode == tabKey) {
    // Prevent the next focus.
    evt.preventDefault()
    // Grab current focused element
    var focusedElement = document.activeElement;
    // Get array of inputs
    var inputs = document.getElementsByTagName('input');
    // Set delay of 2 seconds.
    setTimeout(function() {
        // Loop through inputs
      for (i = 0; i < inputs.length; i++) {
        // If current evaluated input is one with focus...
        if (inputs[i] === document.activeElement) {
            // Grab the next index...
          var focus_input = i + 1;
          // Assure it isn't undefined.
          if (inputs[focus_input]) {
            // Give new input focus.
            inputs[focus_input].focus();
          }
        }
      }
    }, 2000)
  }
}

祝你好运！

按下TAB按钮时，如何延迟移动到下一个输入字段？

1 个答案: