4

我只是试图找到 catcomplete 的文档。我需要有关如何使用 _renderItem 的手册。我找到了这个http://jqueryui.com/autocomplete/#categories但似乎没有提到这只是 _renderMenu 的例子

    _renderMenu: function( ul, items ) {
        var that = this,
            currentCategory = "";
        $.each( items, function( index, item ) {
            if ( item.category != currentCategory ) {
                ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
                currentCategory = item.category;
            }
            that._renderItemData( ul, item );
        });
    }
4

1 回答 1

9

catcomplete只是一个示例,不幸的是它不是 jQuery UI 的一部分,因此没有_renderItemor的文档renderMenu。将其视为 jQuery 源代码的一部分。然而,效果可以很容易地从源代码中重现。

要使用 catcomplete,我们只需确保将 alabelcategoryvalue 都传递给catcomplete,如下所示:

var data = [
    { label: "anders", category: "" },
    { label: "andreas", category: "" },
    { label: "antal", category: "" },
    { label: "annhhx10", category: "Products"},
    { label: "annk K12", category: "Products" },
    { label: "annttop C13", category: "Products" },
    { label: "anders andersson", category: "People" },
    { label: "andreas andersson", category: "People" },
    { label: "andreas johnson", category: "People" }
];

带有空白字符串作为类别的项目将不会被放入类别中并像标准自动完成一样留下。那些给定类别的人将在该类别下进行子菜单。

Fiddle here(jQuery 示例)


要为每个项目添加一个类,您可以简单地附加.addClass(item.category)到小部件中最后一行代码的末尾catcomplete

that._renderItemData( ul, item ).addClass(item.category);

在这里更新小提琴

于 2012-12-04T10:39:56.230 回答