自动完成仅显示消息 N 结果可用，使用向上和向下箭头键导航。而是显示列表答案

【问题标题】：Autocomplete shows only message N results are available, use up and down arrow keys to navigate. instead show list自动完成仅显示消息 N 结果可用，使用向上和向下箭头键导航。而是显示列表
【发布时间】：2013-06-29 12:18:35
【问题描述】：

我的问题很清楚。

我正在使用 jquery 自动完成功能，但我不知道为什么它只显示消息：

9 results are available, use up and down arrow keys to navigate.

没有显示结果列表。

这是我的代码：

<p class="select-c">
     <label for="fcb">Location</label>
     <input id="fcb" name="fcb" type="text">                        
</p>


$("#fcb").autocomplete({
        source: function (request, response) {
            $.ajax({
                type: "GET",
                dataType: 'json',
                url: "../ws/city/" + request.term,
                async: true,
                success: function( data ) {
                    response( $.map( data, function( item,key ) {
                        return {
                            label: key,
                            value: item.id_town+"#"+item.id_province
                        }
                    }));
                },
                error: function (result) {
                    alert("Due to unexpected errors we were unable to load data");
                }
            });
        },
        minLength: 2
    });

结果如下：

可能是什么问题？

【问题讨论】：

你在什么浏览器/设备上测试？
我已经在 chrome 和 safari 上测试过了
您看到任何菜单项还是什么也没有？该插件似乎正在运行，该消息用于 ARIA 支持
没有菜单..没有..只有那个跨度..
你能创建一个 jsfiddle 来复制它吗？我无法复制您的问题...

标签： ajax json jquery-ui autocomplete

【解决方案1】：

只需检查您是否导入了正确的 css 以更正列表呈现

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"/>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css" />

如果您还想删除该消息，请在源之后添加以下条目

$("#fcb").autocomplete({
    //your source info
   messages: {
        noResults: '',
        results: function() {}
    }
});

【讨论】：

【解决方案2】：

检查你的 CSS，也许你隐藏了菜单元素。尝试：

.ui-autocomplete {
  z-index: 10000000;
}

【讨论】：

@JackTurky 您可能没有从 jQuery UI 导入 CSS
css 已正确导入.. 但我需要的是显示列表.. 所以.. 非常感谢!!!!!!!!!!!!

【解决方案3】：

  .ui-helper-hidden-accessible {
            display: none;
        }

【讨论】：

如果您打算用它来回答这个问题，请附上一些您自己的文字，解释它为什么/如何在回答这个问题时起作用，而不仅仅是代码。