Question

我想为文本框使用自动完成菜单，但是我不必在获取结果之前先键入内容，而是希望菜单首先弹出所有可用选项，然后在键入时变窄。

问题是我尝试了聚焦，但没有成功：

这是我的代码：

 var neighborhood_name = ["LA","NW","SE","GF"];
var statuses = [];


$(document).ready(function() {
    BindControls();
});

function BindControls() {

    $('#services').autocomplete({
        source: neighborhood_name,
        minLength: 0,
        scroll: true
    }).focus(function() {
        $(this).autocomplete("search", "");
    });
}

我正在使用下面的jQuery

https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/base/jquery-ui.css

https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js

https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js

https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.js

每当我单击输入时，都会出现以下错误：$（...）。autocomplete不是焦点功能，尽管它在我开始键入内容时起作用，但在我想查看完整列表时不起作用。 \

有任何线索吗？

谢谢！

Answer 1

确保您已包含Jquery UI库。

<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js" ></script>

因此，您将同时包含Jquery和Jquery UI。

[编辑]

这是工作代码

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<script src="https://code.jquery.com/jquery-migrate-3.0.0.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js" ></script>

<input type="text" id="services" value="" />
<script>
 var neighborhood_name = ["LA","NW","SE","GF"];
var statuses = [];


$(document).ready(function() {
    BindControls();
});

function BindControls() {

    $('#services').autocomplete({
        source: neighborhood_name,
        minLength: 0,
        scroll: true
    }).focus(function() {
        $(this).autocomplete("search", "");
    });
} 

</script>

自动完成焦点显示默认下拉菜单似乎不起作用

1 个答案: