0

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

我使用 onfocusout 设置了它来调用一个函数，该函数在用户离开最后一个字段后扩展当前表下方的表，并希望在此之后立即自动选择第一个输入字段。当用户通过单击退出表的最后一个字段时，一切正常，但是当从表中退出时，我认为存在问题，因为在检索下一个表之前没有字段可以被选项卡到使用 AJAX 显示。

如果需要，我可以提供代码，但我认为我遗漏了一些东西，而不是在某个地方出错。帮助将不胜感激，我很乐意澄清任何不清楚的地方。谢谢！

4

1 回答 1

2

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

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

这是一个小提琴，展示了如何做到这一点：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)
  }
}

祝你好运！

于 2017-09-08T21:29:07.227 回答