在 javascript 或 JQuery 中触发或返回 shift+tab

Question

我使用 tabIndex 为带有二维导航的 Windows CE 制作了一个页面。 起初我只是想使用 tabIndex 作为下一个焦点的参考。

因为此应用程序适用于便携式设备，因此与简单的 tab 和 shift+tab 相比，这样做对手持设备的要求非常高，并且非常耗时。

我有一个函数来处理我的向上箭头和向下箭头的 onkeydown，对于我的向下箭头，代码很简单

if(specialMove == 0){所有这一切都是检查选项卡没有离开页面。

event.keyCode=9; return;}

问题是我的向上箭头，我希望它返回一个 SHIFT+TAB 来向上导航，我发现了这段 jQuery 代码，但是我在使它工作时遇到了问题。

if(specialMove == 0){
    $('body').trigger(JQuery.Event('keydown', {keyCode:9, shiftKey: true}));
    return;
}

Answer 1

在这种情况下，触发器仅调用主体上定义的事件处理程序。 它不会将密钥代码发送到浏览器。 请参阅： http : //api.jquery.com/trigger/ 。 简而言之，它只执行 jQuery 知道在 keydown 事件发生时会执行的代码。 它“模拟”了一个按键事件。

据我所知，向浏览器发送关键事件是不可能的，因为这会带来一些严重的安全风险。 您必须在 Javascript 中实现选择下一个和上一个元素。

编辑：您可以尝试以下操作：

$(function() {
  var navigationElements = $('[tabIndex]').sort(function(a,b) {
    return $(a).attr('tabindex') - $(b).attr('tabindex');
  });

  // We don't know if the users presses the up or down button first
  // so we initialize as null and let the event handle the first element
  var currentIndex = null;

  // On event:
  if (currentIndex != null && currentIndex < navigationElements.length - 1) {
    navigationElements[++currentIndex].focus();
  } else {
    currentIndex = 0;
    navigationElements[currentIndex].focus();
  }

  // and:
  if (currentIndex != null && currentIndex > 0) {
    navigationElements[--currentIndex].focus();
  } else {
    currentIndex = navigationElements.length - 1;
    navigationElements[currentIndex].focus();
  }
});

这是未经测试、未经优化的代码，因此可能有更好的解决方案，但即使在慢速浏览器上也能运行得非常快。 它不考虑未通过您的事件的焦点更改，因此您必须添加onfocus事件以将currentIndex设置为用户最后选择的元素。

Answer 2

 const keyupEvent = new Event('KeyboardEvent'); keyupEvent.initEvent('keyup'); Object.defineProperties(keyupEvent, { keyCode: { value: 9 }, shiftKey: { value: true } }); ... element.dispatch(keyupEvent);