Tab 按键事件不起作用（本机 JavaScript）答案

【问题标题】：Tab keypress event doesn't work (native JavaScript)Tab 按键事件不起作用（本机 JavaScript）
【发布时间】：2015-06-25 19:02:14
【问题描述】：

所以我最近一直在学习 JavaScript，但我似乎无法弄清楚为什么以下代码不起作用。我在“输入”上使用了一个按键事件（按键代码 13，以防有人好奇），它运行良好。但是我无法让按键代码 9（选项卡）工作。

函数 listItemTab 本身似乎可以工作，但它永远不会进入我的 if 语句（我的 console.log 永远不会执行）。

the codepen I've been working 已开启，因此您可以在我的 html 的上下文中查看所有代码。

var myList = document.getElementById("my-list");
var listItems = myList.querySelectorAll("li");
var inputs = myList.querySelectorAll("input");

for(var i = 0; i < listItems.length; i++){
    inputs[i].addEventListener("keypress", listItemTab);
}

function listItemTab(event){
    if(event.which === 9){
        console.log("tab pressed");
    }
}

提前感谢您的帮助！ :)

【问题讨论】：

标签： javascript events keypress

【解决方案1】：

尝试使用 keydown 事件而不是 keypress 事件。 Keydown 首先触发。如果您想留在输入中，也请阻止默认操作。（如果您不想留在输入中，只需删除该行）

inputs[i].addEventListener("keydown", listItemTab);

// not working yet
function listItemTab(event){    
    event.preventDefault();
    if(event.which === 9){
        console.log("tab pressed");     
    }
}

【讨论】：