Question

我的自动填充弹出窗口出现问题。

以下是我的自动填充脚本

$(function() {
    $("#search").autocomplete( 
        source:values
    })
});

现在这个#search位于我的屏幕中心，当输入任何值时，autocomplte功能将输出提供给极左，这是不可见的（虽然功能正常）。我需要在#search。

下面移动这个自动完成建议框

Bleow是我的#search职位

<input type="text" id="search" placeholder="Please enter the value" style="position: absolute; right: 445px; top: 190px;" size="20"/>

这是在div内。

此致阿尼什

Answer 1

尝试使用appendTo属性。您可以将Id或Class设置为输入的父div并将自动完成元素附加到它...它可能会修复您的问题......如果没有，它应该是一个更好的代码：）

HTML：

<div id="appendToHere">
<input type="text" id="search" placeholder="Please enter the value" style="position: absolute; right: 445px; top: 190px;" size="20"/>
</div>

JS：

$(function() {
    $("#search").autocomplete( {
        source:values,
        appendTo: "#appendToHere"
    })
});

在这里阅读更多内容 http://api.jqueryui.com/autocomplete/#option-appendTo

还有一件事，那个位置：绝对可能是问题，尽量不添加，看看会发生什么

并确保您只有一个带有该ID的元素，否则选择器'#search'将会疯狂;）

Answer 2

我在观察中发现只有一个语法错误，你在自动完成的选项对象中错过了{ 的 See Working Fiddle

$(function() { $("#search").autocomplete({ source:values }) });

JQuery UI将自动管理位置！我发现有任何问题。

修改你说这个列表显示在页面的最开头。我在想你的布局css样式导致了这个问题。

尝试以下

删除绝对位置，左，右样式，看看它是如何工作的？

想一想为什么在输入标签级别需要这些样式，为什么不应用于它的父级。

按照B.J的回答中的建议尝试`appendTo' Option。

jquery自动完成位置

2 个答案: