如何触发Tab键按钮事件？

Question

如果您看到下面附带的图像。鼠标悬停时国家/地区名称样式会更改。但是当我单击向下箭头键时，我们必须显示相同的行为。 有人能告诉我怎么做吗？

Answer 1

想法是绑定keydown事件，如果键是向下箭头 - 你应该在列表中选择下一个。您必须拥有当前选择的索引并使用它突出显示菜单项。当鼠标悬停在事件上时，只需将当前选择索引更改为悬停项。使用索引更改背景颜色。使用ReactJs和类似的UI框架非常容易，而且jQuery有点乱，但如果你有了这个想法，希望你能成功。

应该有用的2个代码段：

$(document).keydown(function(e) {
    switch(e.which) {
        case 37: // left
        break;

        case 38: // up
        break;

        case 39: // right
        break;

        case 40: // down
        break;

        default: return; // exit this handler for other keys
    }
    e.preventDefault(); // prevent the default action (scroll / move caret)
});

$('.tg').bind('keypress', function(event) {
  if(event.which === 13) { // tab
    $(this).next().focus();
  }
});

来源： - Simulate pressing tab key with jQuery - Binding arrow keys in JS/jQuery

我有演示回购，其中我使用ReactJs https://github.com/liesislukas/react-dropdown-autocomplete-with-search

做了类似的事情