如何在html中的文本框上显示自动完成jquery ui答案

【问题标题】：How to show autocomplete jquery ui on textbox in html如何在html中的文本框上显示自动完成jquery ui
【发布时间】：2015-08-25 05:22:59
【问题描述】：

这是我的代码：我从 ajax 获取值并将其显示为自动完成。我在stackoverflow中尝试了很多解决方案。但我没有得到这个。请有人帮助我从中恢复：

   $(document).on("change", "#selectbox-city-list2", function(){
        $("#inputArea").val('');
        $("#inputAreaCtrl").val('');
        $.ajax({
            url: "<?= BASE_URL ?>/shop/area.html",
            type: "get",
            data: {city_key: $("#selectbox-city-list2").val()},
            dataType: "json",
            success: function(data){
                $options = [];
                $.each(data, function(i, field){
                    $option = {"label":field.location, "value": field.area_key};
                    $options.push($option);
                });

                $("#inputArea").autocomplete({
                    source: $options,
                    select: function(event, ui){
                        $("#inputArea").val(ui.item.label);
                        $("#inputAreaCtrl").val(ui.item.value);
                        return false;
                    }.focus(function(){
                        if($("ul.ui-autocomplete").is(":hidden"))
                        {
                            $(this).autocomplete('search', ''); //tried this
                             $("ul.ui-autocomplete").show(); //tried this
                           //But no luck
                        }
                    });
                });
            },
            error: function(xhr, error, status){
                alert(status);
            }
        });
    });

提前致谢

【问题讨论】：

你可以创建一个 jsfiddle，jsfiddle.net
我是在本地主机的 ajax 上这样做的，这就是为什么我给出这个代码
好的，那么您的上述解决方案到底有什么问题？
当我更改选择框值时，另一个文本框会填充自动完成，当我专注于该框时，它必须显示自动完成。但是当我专注于该文本框时，它不会显示自动完成

标签： jquery html ajax jquery-ui jquery-ui-autocomplete

【解决方案1】：

我得到了答案，只是在自动完成功能中添加了 minLength: 0

   $("#inputArea").autocomplete({
                    source: $options,
                    select: function(event, ui){
                        $("#inputArea").val(ui.item.label);
                        $("#inputAreaCtrl").val(ui.item.value);
                        return false;
                    },
                    minLength: 0
                });

【讨论】：