提问人:gardarvalur 提问时间:5/17/2023 更新时间:5/17/2023 访问量:20
自动打开 jQuery UI 自动聚焦
Auto open jQuery UI autocomoplete on focus
问:
我希望自动完成在输入焦点上自动打开下拉列表。
这是我的例子:
$(".tag-input").autocomplete({
source: tagInputOptions,
sortResults: true,
select: function (event, ui) {
var selectedValue = ui.item.value;
if (selectedValue !== "") {
$(this).next(".tag-input-button").click();
}
return false;
}
}).keydown(function(event) {
if (event.originalEvent.keyCode === 13) {
// Enter key pressed
event.preventDefault();
var selectedValue = $(this).val();
if(selectedValue !== "") {
$(this).next(".tag-input-button").click();
}
}
}).on("focus", function () {
$(this).autocomplete("search", " ");
});
我试过触发搜索让它打开,但它没有打开:$(this).autocomplete("search", " ");
我以为它会以未过滤的列表打开。
我实际上不会打开,也没有错误。
答:
1赞
2ju2
5/17/2023
#1
像这样添加 minLength 和 focus 函数。
var tagInputOptions = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$(".tag-input").autocomplete({
source: tagInputOptions,
sortResults: true,
minLength : 0, //add this line
}).keydown(function(event) {
if (event.originalEvent.keyCode === 13) {
// Enter key pressed
event.preventDefault();
var selectedValue = $(this).val();
if(selectedValue !== "") {
$(this).next(".tag-input-button").click();
}
}
}).focus(function() { //add this line
$(this).autocomplete("search", $(this).val());
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags" class="tag-input">
</div>
评论
0赞
gardarvalur
5/17/2023
谢谢!这很完美。我尝试了很多版本,甚至尝试过问 chatGPT ;)
评论