自动完成焦点显示默认下拉菜单似乎无效

问题描述 投票:0回答:1

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

问题是我尝试了聚焦,但没有成功:

这是我的代码:

 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不是焦点功能,尽管它在我开始键入内容时起作用,但在我想查看完整列表时不起作用。 \

任何线索?

谢谢!

jquery jquery-ui jquery-ui-autocomplete
1个回答
0
投票

确保已包含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>
© www.soinside.com 2019 - 2024. All rights reserved.