javascript – 滚动DropDownlist自定义

我使用这个DropDownList搜索项目,我有一个问题我的问题是如何在键盘中向上和向下滚动这个DropDownList？
JSfiddle

解决方法

编辑：由于我的第一个解决方案在添加更多项目时工作不正常,我调整了一点. Here’s the fiddle

我做了什么：

首先,我检查了storeTarget和#search_results的位置,并将其记录到控制台中以找出导致问题的原因.
(这是你自己可以完成的事情……)
我发现的是,在几个项目之后,storeTargetitem的顶部位置高于#search_results的可见区域.

所以我改变了参数

$("#search_results").scrollTop(storeTarget.offset().top);

滚动比当前位置更远一点,并使其更平滑更改if-clause中的检查：

if(storeTarget.offset().top>220){
       $("#search_results").scrollTop($("#search_results").scrollTop()+40);
       console.log(storeTarget.offset().top);
       console.log($("#search_results").scrollTop());
       }

当用户上升时,我没有检查是否有这种情况,这是由你决定的.

here’s a working fiddle based on your code

结束编辑

我做了什么：

当使用键向上或向下移动时,我检查storeTarget的offset().top值是大于还是小于200(你可以根据列表的大小改变它),如果是,我们滚动#的顶部搜索结果到
商店顶部目标：

if(storeTarget.offset().top>200){
   $("#search_results").scrollTop(storeTarget.offset().top);
}