javascript - 在 DropDownlist 中滚动自定义

Question

我正在使用此 DropDownList 搜索项目，但我遇到了一个问题 我的问题是如何在键盘中上下滚动此 DropDownList？
JSfiddle

Answer 1

编辑:由于我的第一个解决方案在添加更多项目时无法正常工作，因此我对其进行了一些调整。 Here's the fiddle

我做了什么:

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

所以我改变了

的参数

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

为了比当前位置滚动得更远一点并使其更平滑，更改了 if 子句中的检查:

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(您可以更改它，具体取决于在你的列表的大小上)，如果是这样，我们将 #search-results 的顶部滚动到
storeTarget 的顶部:

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