Javascript 如何在使用上下键向下滚动时聚焦和突出显示循环元素?

Javascript 如何在使用上下键向下滚动时聚焦和突出显示循环元素?,javascript,jquery,html,Javascript,Jquery,Html,我发现这样可以在使用键盘键上下滚动时突出显示循环元素的行。但是我不能在我的html布局上工作。这是我的密码 <div id="filterdiv" > <label id="resultnum" ></label> <label id="scrolldummy"></label> <div id="navdiv"> <div id="proddiv"><label

我发现这样可以在使用键盘键上下滚动时突出显示循环元素的行。但是我不能在我的html布局上工作。这是我的密码

<div id="filterdiv" >
    <label id="resultnum" ></label> 
    <label id="scrolldummy"></label>
    <div id="navdiv">
        <div id="proddiv"><label id="prodlabel" style="height:30px;">Products </label></div>
        <div id="divcategory"><label id="categorylabel" style="height:30px;color:orange">All Categories</label></div>
        <div id="subcategorydiv"><label id="subcategorylabel" >All Sub Categories </label></div>
    </div>
    <div id="filtercontainerdiv" >
        <div id="dropdowndiv" > 
            <input type="text" id="txtloc" value="All Locations" readonly="true" title="Filter by Location"  />
            <div id="dropdowncontainer" >
                <input type="text" id="searchloc" class="searchloc"  onkeyup = "QueryLocatio()" placeholder="Search Location"  />
                <div id="dropdownlist" data-bind="foreach: PopulateAllLocation">
                     <div id="alllocationdiv" > <label id="listlocation" class="listlocation" data-bind="text: CityTown"></label></div>               
                </div>
            </div>
        </div>
    </div>
</div>

请帮助..

为什么这不起作用?你在控制台中有错误吗?@CliffBurton没有,我在控制台中没有看到任何错误。当我按下向上向下键时,它就不起作用了。你认为它在我的css上吗?因为我的css for active只是突出显示背景色,例如,active{background color:lightgrey}。有什么想法吗?你能展示你的CSS吗?我想这是因为标签在div里面。试试-$this.next'.listlocation'.focus;$this.prev'.listlocation'.focus;
 // Highlight list of Location while pressing arrow down up key
        $('#dropdowncontainer').on('focus', '.listlocation', function () {
            $this = $(this);
            $this.addClass('active').siblings().removeClass();
            $this.closest('#dropdowncontainer').scrollTop($this.index() * $this.outerHeight());
        }).on('keydown', '.listlocation', function (e) {
            $this = $(this);
            if (e.keyCode == 40) {
                $this.next().focus();
                return false;
            } else if (e.keyCode == 38) {
                $this.prev().focus();
                return false;
            }
        }).find('.listlocation').first().focus();