javascript - 渲染自定义自动完成结果

Question

我有以下代码:

jQuery("#hotelName").autocomplete({
            serviceUrl:'xxxxxxxxxxxxxxxxxxxxxxxx',
            minChars:1,
            delimiter: /(,|;)\s*/, // regex or character
            maxHeight:200,
            zIndex: 9999,
            appendTo: "#ui-front"
         }).data( "ui-autocomplete" )._renderItem = function( ul, item ) {
                console.log(item);
              return jQuery( "<li>" )
                .data( "ui-autocomplete-item", item )
                .append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
                .appendTo( ul );
            };

我从控制台收到此错误:

Cannot set property '_renderItem' of undefined

我正在使用 jQuery UI 自动完成 1.2.9

自动完成工作正常，没有任何问题，如下所示:

jQuery("#hotelName").autocomplete({
                serviceUrl:'xxxxxxxxxxxxxxxxxxxxxxxx',
                minChars:1,
                delimiter: /(,|;)\s*/, // regex or character
                maxHeight:200,
                zIndex: 9999,
                appendTo: "#ui-front"
             });

但我想应用自定义渲染。知道问题出在哪里吗？

编辑:

我尝试将 jQuery UI Auto Complete 升级到最新版本，但这对我没有帮助。

Answer 1

要从包装应用了此小部件的元素的 jQuery 对象获取小部件实例(您要调整的 _renderItem 属性)，您应该使用 instance() widget的方法，如the docs所示。例如:

$('#input_to_autocomplete')
  .autocomplete(widgetOptions) // applying the widget
  .autocomplete('instance')    // getting the widget's instance
  ._renderItem = function(ul, item) { /*... */ }; // augmenting the display function