javascript - event.preventDefault()仅工作一次

当我第一次按下选项卡按钮时，它会起作用，并且不会阻止使用选项卡，但是，如果我再次立即按下它，则不会阻止默认设置，并且会在输入框中跳出选项卡。

如果我先输入某些内容然后按Tab，然后再输入其他内容然后按Tab，那么默认情况下每次都会阻止

问题是我不能连续两次按Tab键。知道可能是什么问题吗？

 $("#functionSearch").on("change propertychange keyup",function( event ) {
    event.preventDefault();
    console.log(event)
    if (event.which == 9 ) {
        console.log("TAB")
    }else{
        clearHighlight();
        var input = $(this).val();
        if(input.length > 0){
            filteredArr = jQuery.grep(linksArr, function( val, index ) {
                return ( val.toLowerCase().indexOf(input.toLowerCase()) != -1);
            });
            selectElements(filteredArr);
        }
    }

});

// MAY BE USEFUL
function selectElements(filteredArr){
    $(filteredArr).each(function( index, link){
       var id = link.split("~")[1]
       $("#"+id).addClass("selected");
    });
    highlightFirstElement();
    }

    function highlightFirstElement(){
        $(".selected").first().addClass("highlighted");
    }

    function highlightNextElement(){
        $(".selected").next().addClass("highlighted");
    }

    function clearHighlight(){
        $(".highlighted").removeClass("highlighted");
        $(".selected").removeClass("selected");
    }

<div id="functionSearchDiv" class="funSearch">
    <input type="text" id="functionSearch"></input>
</div>

最佳答案

在keyup触发时，TAB键可能已经完成了将焦点转移到另一个元素的工作，这意味着keyup事件将在另一个元素上触发，而不是在输入字段上触发。

最简单的解决方案是听keydown而不是keyup(请参阅working fiddle)。