Question

我得到了以下代码，除了我希望当光标进入class =“bas”的任何字段时自动出现选项列表时，它工作正常。

Evyerthing工作正常然而我已经尝试了几个选项而没有按预期进行。下面的代码需要按ALT +向下箭头才能显示列表。使用$(this).autocomplete("search");（我在搜索答案时显示在Google中的内容）不会执行任何操作。使用$(this).autocomplete("search","");也不起作用。

任何想法我做错了???

$('.bas').each(function () {

                        var basis_options = [
                          { value: 'Spain', data: 'ES' },
                           { value: 'Italy', data: 'IT' },
                           { value: 'Portugal', data: 'PT' },
                           { value: 'Greece', data: 'GR' },
                           { value: 'Malta', data: 'MT' },

                        ];


                    var txt = $(this);
                    txt.autocomplete({
                        source: basis_options,
                        minLength: 0,
                        focus: function (event, ui) {      
                            $(this).trigger('focus.autocomplete');
                            //$(this).autocomplete("search"); <<< doesn't work
                        },
                       select: function ( event, ui ) { 
                            $(this).val( ui.item.data );                            
                       },
                       change: function () {
                            $(this).trigger("change");
                        }
                    });

                 });

Answer 1

而不是$(this).autocomplete("search");

<强>尝试：

$(this).autocomplete("search", $(this).val());

Answer 2

好的，我找到了问题的解决方案，希望这会对其他人有所帮助。此代码适用于任何带有csclass =“bas”的文本框（根据需要更改）

只要您专注于该字段，就会显示可用选项列表。只需向上/向下箭头或点击你想要的那个。

在下面的示例中，用户在列表中看到国家/地区名称（例如：西班牙），但一旦选择，国家/地区代码（ES）就会实际填充文本框。

我希望它可以帮助其他人...

$('.bas').each(function () {

                        var basis_options = [
                          { value: 'Spain', data: 'ES' },
                           { value: 'Italy', data: 'IT' },
                           { value: 'Portugal', data: 'PT' },
                           { value: 'Greece', data: 'GR' },
                           { value: 'Malta', data: 'MT' },

                        ];

var txt = $(this);
                        txt.autocomplete({
                            source: basis_options,
                            delay: 0,
                            minLength: 0,
                            select: function (event, ui) {$(this).val(ui.item.data); return false},
                            change: function (event, ui) {$(this).trigger("change")}
                        }).bind('focus', function () {
                            $(this).autocomplete("search");
                        })

jquery自动完成显示焦点上的项目的完整列表

2 个答案: