jQuery-自动完成滚动问题

Posted 2023-05-09

技术标签:

【中文标题】jQuery-自动完成滚动问题【英文标题】：jQuery-autocomplete scroll issue 【发布时间】：2012-07-18 11:41:27 【问题描述】：

我在我的应用程序中使用rails3-jquery-autocomplete。我遇到了以下问题：如果您在输入字段中输入某些内容以显示自动完成数据并在此之后滚动页面，则带有自动完成数据的框不会随页面滚动。它保持在相同的位置。

你可以看看我面临的here。请注意，此示例不是由我创建的，因此我不确定此处是否使用了相同的 jquery 插件。不过问题还是差不多的。

【问题讨论】：

【参考方案1】：

将此添加到 css 中

     .ui-autocomplete  
       height: 200px;
       overflow-y: scroll;
       overflow-x: hidden;

【讨论】：

【参考方案2】：

您可能缺少自动完成选项中的 appendTo-attribute。它默认为 body，但您可能希望将它作为您的容器 div（如果没有看到您的代码就很难准确地说出来）。

见documents。

【讨论】：

【参考方案3】：

但是您是否检查过场景，在应用高度和溢出结果后无法使用键盘向下箭头滚动列表，而键盘向下箭头可以使用鼠标滚动。如果我们使用键盘滚动它，让滚动条保持理想状态，并使高亮值遍历整个列表。

【讨论】：

【参考方案4】：

我知道这很旧，但我只是在我自己的项目中通过在我的项目中将“位置：固定”的 CSS 属性添加到“.ui-autocomplete”来解决这个问题。如果需要，请在此处查看：34.212.191.181:3000。

P/s 页面是越南语，只需在导航栏中使用搜索框即可：)

【讨论】：

以上是关于jQuery-自动完成滚动问题的主要内容，如果未能解决你的问题，请参考以下文章