tab 键的 keyup/Keydown 事件不起作用答案

【问题标题】：keyup/Keydown event for tab key is not workingtab 键的 keyup/Keydown 事件不起作用
【发布时间】：2014-03-24 04:00:35
【问题描述】：

我为选项卡使用了 keyup 事件。但是由于某种原因，该代码只能与其他键码一起运行，例如 38,40,13 。通过按选项卡，它只会执行默认选项卡操作并忽略代码。请帮忙。

dom.live('keyup', function (e) {
    var newDom = $(this);
    var suggestionpageCount = newDom.attr('data-counter');
      if ((e.keyCode == 38) || (e.keyCode == 40)) {
        ..some code here

    }
    else if (e.keyCode == 13) {
        ..some code here
    }
else if (e.keycode == 9) {
        ..some code here
    }

我也尝试将它添加到 dom.live('keydown', function (e) 但它也不起作用..

所以我注意到当光标聚焦在文本框上时，keyup/keydown 功能不适用于制表键。你有什么想法？谢谢

【问题讨论】：

'keydown' 也适用于“Sridhar R”答案

标签： javascript jquery

【解决方案1】：

你需要做的是监听父级的keydown和delegate向下的事件，tab键的默认行为是改变元素焦点，这意味着keyup发生在页面上的下一个元素上。

$('textarea').parent().on('keydown', 'textarea', function(e) {
  if (e.keyCode === 9) {
    e.preventDefault();
    console.log('Tab key pressed');
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea></textarea>

另外，请尝试使用switch 而不是大量的if/else 语句。它们更容易阅读，并且通常优于 if's/else's

【讨论】：