如何在页面上只修补一个*自动完成实例？

Question

这个答案 - jQueryUI:我如何自定义格式化Autocomplete插件结果？ - 描述如何对jqueryUI自动完成小部件进行monkeypatch,以便以特定方式显示内容.它使用的方法是替换上的函数$.ui.autocomplete.prototype.

这意味着所有自动完成小部件都将获得此修补程序.

有没有办法只为一个输入元素修补自动完成小部件？它是什么？

当我检查时$('$input').autocomplete,我没有看到任何自动完成文件(_renderItem,_renderMenu,_search等).

Answer 1

查看自定义数据并显示演示.此演示不会修改自动完成窗口小部件的原型对象,这意味着只有窗口小部件的实例受到影响:

$("selector").autocomplete({ ... }).data( "autocomplete" )._renderItem = function( ul, item ) {
    return $( "<li></li>" )
        .data( "item.autocomplete", item )
        .append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
        .appendTo( ul );
};

这是一个有效的演示:http://jsfiddle.net/vJSwq/

Answer 2

Andrew Whitaker的代码只适用于一个自动完成输入.如果您选择多个输入元素,则第二个自动完成小部件不会显示任何要素.你必须添加的foreach到韩德尔所有选择的输入元素,如提到这里

$("selector")
.autocomplete({ ... })
.each(function () {
    $(this).data("autocomplete")._renderItem = function( ul, item ) {
        return $("<li></li>")
            .data("item.autocomplete", item)
            .append("<a>" + item.label + "<br>" + item.desc + "</a>")
            .appendTo(ul);
    };
);