9

jQuery 自动完成 UI - 我想开始搜索“onfocus”,并在用户选项卡或单击搜索字段时立即显示选项列表,而无需用户输入任何内容。

默认行为似乎要求用户输入字符或向下箭头以开始滚动并开始搜索并获取值,即使我将所需的字符数设置为零也是如此。

$( "#contact" ).autocomplete({
    来源:'remote.php',
    最小长度:0
});

谢谢!

4

7 回答 7

13

比埃米特的回答复杂一点,但是......

  • 即使框已经包含文本,也会在焦点上弹出列表
  • 避免单击项目后重新弹出列表

这里是:

var closing = false;

$('#contact').autocomplete({
    source: 'remote.php',
    minLength: 0,
    close: function()
    {
        // avoid double-pop-up issue
        closing = true;
        setTimeout(function() { closing = false; }, 300);
    }
})
.focus(function() {
    if (!closing)
        $(this).autocomplete("search");
});
于 2011-09-17T11:04:01.327 回答
7

我发现这段代码更简洁一些,并且特定于元素。

 $(<selector>).autocomplete({
            minLength: 0,
            delay: 500,
            source: funcDataLookUp,
            open: function() { $(this).attr('state', 'open'); },
            close: function () { $(this).attr('state', 'closed'); }
        }).focus(function () {
            if ($(this).attr('state') != 'open') {
                $(this).autocomplete("search");
            }
        });
于 2013-03-28T14:32:40.937 回答
5

尝试focus使用自动完成绑定。

$("#contact").autocomplete({
        source: 'remote.php',
        minLength: 0
    }).bind('focus', function () {
        $(this).autocomplete("search");
    });

查看我的示例JSFiddle

于 2013-07-08T04:32:33.407 回答
4

该解决方案并不完全适合我,因为在选择所需结果后,自动完成结果框会再次弹出。这是因为该.focus方法是在close:事件之前执行的。

此外,根据该答案中的代码,一旦盒子关闭,它就不会打开备份,因为closing变量true由于close:在之后执行而保留.focus

以下代码解决了这两个问题(注意变量closingclose:事件中设置为 false):

var closing = false;

$(function() {$(".autocomplete").autocomplete({
    source: 'remote.php',
    minLength: 0,
    open: function(){
        closing=true; },
    close: function(){
        closing = false;
        }
})
    .focus(function(){
        if ((!closing) && ($(this).val() !== "")){
            $(this).autocomplete("search");
        }
    });
})
于 2012-01-26T07:48:59.513 回答
3

这个解决方案对我不起作用,但是这个:

$('#contact').autocomplete({
source: 'remote.php',
minLength: 0
           }).focus(function(){
if (this.value == "")
$(this).trigger('keydown.autocomplete');
});

效果很好(来源:jquery 论坛

于 2011-11-10T12:30:17.930 回答
3
$("#contact").focus(function() {
    if ($(this).val().length == 0) {
        $(this).autocomplete("search");
    }
});

Make sure your autocomplete's minLength is 0.

于 2010-12-18T19:15:58.850 回答
2

JQUERY 实际上建议使用这种方法

http://api.jqueryui.com/autocomplete/#method-search

$('.yourclass').autocomplete({
   minLength: 0
   ,source:['blah','andblahagain']
   ,focus: function() {
     $(this).autocomplete("search", "");
   },
});

基本上,您使用 minLength:0 和搜索“”的焦点事件。

于 2014-07-11T20:55:58.270 回答