Tab键的按键事件不起作用（原生JavaScript）

Question

因此，我最近一直在学习JavaScript，但似乎无法弄清楚以下代码为什么不起作用。 我在“ enter”上使用了一个按键事件（按键代码13，以防万一有人好奇），它可以很好地工作。 但是我无法使按键代码9（选项卡）正常工作。

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

这是我一直在努力的codepen ，因此您可以在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");
    }
}

在此先感谢您的帮助！ :)

Answer 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");     
    }
}