jQuery AutoComplete : 让建议出现在文本框上答案

【问题标题】：jQuery AutoComplete : Make suggestions appear over the text boxjQuery AutoComplete : 让建议出现在文本框上
【发布时间】：2013-08-20 21:45:35
【问题描述】：

我正在使用此处找到的 Jquery 自动完成插件：http://jqueryui.com/autocomplete/

它工作正常，但自动完成提示显示为下拉列表，而我希望它显示为下拉列表（不知道它是否正确，但我希望点击显示在文本框上不低于它）。

有什么方法可以做到这一点？

【问题讨论】：

标签： jquery jquery-ui jquery-ui-autocomplete

【解决方案1】：

JQuery UI 自动完成的默认位置设置包括：

 position: {
        my: "left top",
        at: "left bottom",
        collision: "none"
    },

您可以在通话中提供以下信息：

$('.whatever').autocomplete({
   position: {
       my: "left bottom",
       at: "left top",
   });

【讨论】：

是的，我想通了 :)
@Edward：谢谢。那是凭记忆，而不是小提琴:)

【解决方案2】：

您可以使用 jQuery Ui 自动完成position 选项；该选项允许您使用 jQuery UI 位置实用程序设置建议列表的位置。

快速参考：

标识建议菜单相对于关联的输入元素。 of 选项默认为输入元素，但是您可以指定另一个要定位的元素。你可以参考到 jQuery UI Position 实用程序以获取有关各种选项。

代码：

$(function () {
    var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"];

    $("#tags").autocomplete({
        source: availableTags,
        position: {
            my: "left bottom",
            at: "left top",
        }
    });

});

Worging 演示：http://jsfiddle.net/IrvinDominin/KQdg8/

文档：http://api.jqueryui.com/autocomplete/#option-position

【讨论】：