javascript JQuery UI 自动完成 - 当用户在文本框中单击时打开菜单
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8401734/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery UI Autocomplete - Have the menu open when user clicks in the text box
提问by Greg
I'm using this JQuery autocomplete widget.
我正在使用这个JQuery 自动完成小部件。
How can I make it automatically open the menu when the user clicks in the text box? I want the user to see all the options.
当用户单击文本框时，如何使其自动打开菜单？我希望用户看到所有选项。
回答by Andrew Whitaker
You need to trigger the searchevent manually and set the minLengthoption on the widget to zero:
您需要search手动触发事件并将minLength小部件上的选项设置为零：
$("input").autocomplete({
minLength: 0,
/* other options */
}).on("focus", function () {
$(this).autocomplete("search", "");
});
Working example:http://jsfiddle.net/9JmVu/
工作示例：http : //jsfiddle.net/9JmVu/
回答by Greg
I think I got it actually. If you set minLength to 0, and then trigger a search for "", it opens the menu.
我想我真的明白了。如果将 minLength 设置为 0，然后触发对“”的搜索，则会打开菜单。
$(inputSelector).autocomplete(
{
source: this.validConstructCodes,
minLength: 0,
autoFocus: true,
autoSelect: true
});
$(inputSelector).focus(function(event) {
$(this).autocomplete( "search" , "" );
});
回答by amalesh
As explained from Andrew you need to trigger the event.
正如安德鲁解释的那样，您需要触发事件。
But once you got the result from an ajax request, it's better to show the results again instead of asking the server again. The minLength value is independent, could be 2 as recommended on server requests.
但是一旦你从ajax请求中得到结果，最好再次显示结果而不是再次询问服务器。minLength 值是独立的，根据服务器请求的建议可以是 2。
$("input").autocomplete({
minLength: 2,
/* your options */
}).on("focus", function () {
/* the element with the search results */
var uid = $("#ui-id-"+$(this).autocomplete("instance").uuid);
if(uid.html().length == 0) {
/* same as $(this).autocomplete("search", this.value); */
$(this).keydown();
}
else {
uid.show();
}
});
回答by nikossyr
Slight change of @amalesh answer to work with jQuery Autocomplete v1.8. I added +1 to the uuid because it starts from 0 but the id is set to 1.
@amalesh 答案略有变化以使用 jQuery Autocomplete v1.8。我在 uuid 中添加了 +1，因为它从 0 开始，但 id 设置为 1。
$("input").autocomplete({
minLength: 2,
/* your options */
}).on("focus", function () {
/* the element with the search results */
//
let uid = $("#ui-id-" + ($(this).autocomplete("instance").uuid + 1));
if(uid.html().length === 0) {
/* same as $(this).autocomplete("search", this.value); */
$(this).keydown();
}
else {
uid.show();
}
});
