如何更改附加到类的jquery ui自动完成中的下拉列表的呈现？

Question

我从jQuery UI站点复制了一些代码并将其附加到我自己的代码中:

$('.field_values') // class that all input fields are a member of in my html
// here I am skipping .autocomplete, which works
// next comes the copied code
.data( 'ui-autocomplete' )._renderItem = function( ul, item ) {
return $( '<li>' )
.append( '<a>' + item.label + '<br>' + item.value + '</a>' )
.appendTo( ul );
 }
;

我在这个_renderItem函数上找不到任何文档.另一个stackoverflow问题/答案表明问题可能是一个类而不是一个id.但我必须上课,因为有很多领域.

我怎样才能让这个与我的班级一起工作？

Answer 1

看看我尝试了什么.它似乎对我有用.我希望我理解你的问题.

$(document).ready(function () {
    //...here is the projects source

    $(".field_values").autocomplete({
        source: projects,
        create: function () {
            $(this).data('ui-autocomplete')._renderItem = function (ul, item) {
                return $('<li>')
                    .append('<a>' + item.label + '<br>' + item.value + '</a>')
                    .appendTo(ul);
            };
        }
    });
});

这是一个有效的例子.

使用您的方法,似乎自定义渲染仅应用于您单击的第一个自动完成输入,但使用create事件,它会在创建时应用于每个自动完成.field_values.

使用jQuery v 1.9.3和jQuery UI 1.10.3创建了这个小提琴(使用UI 1.9.1也能正常工作)

这是github上_renderitem函数的源代码.