jQuery 模拟 Tab 键：使用按键事件检查焦点并前进到下一个

Question

我有一个表格。用户按下回车键。他们的按键被捕获，我希望我的脚本将焦点推进到当前表单中的下一个可见表单元素。

我目前的想法是我需要获取输入列表以循环关注焦点，但我坚持推进的概念——比如，我如何弄清楚 "next" 是什么它需要去的是？到目前为止，这是我的代码。

$('.myitems input').on('keydown', function(e){
  if ( e.which == 13 ) {

    // Get list of items I want to iterate through
    var fields = $('.myitems input:visible');

    // ...Now what...
  }

});

我基本上想将焦点转移到项目集中的下一个可见输入。我猜想，为了做到这一点，我需要扫描这些项目，找出哪些项目具有焦点，然后将焦点分配给列表中的下一个项目。

但我想不出有什么方法可以合理高效地执行此操作。有什么想法吗？

Answer 1

这将在同级输入之间循环焦点。我使用 nextAll 以防万一除了 input.

之外还有别的东西

$('input.items').on('keydown', function(e){
  if ( e.which == 13 ) {
   var $next = $(this).nextAll('input');
    if($next.length === 0){
      $next = $(this).siblings('input');
    }
    $next.first().focus();
  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input class="items" type="text"> <br>
  <input class="items" type="text"> <br/>
  <input class="items" type="text"> <br/>
  </form>

jQuery 模拟 Tab 键：使用按键事件检查焦点并前进到下一个

jQuery simulate tabbing: use keypress event to check for focus and advance to next

javascript

jquery

jquery-selectors