jQuery UI自动完成：向特定项添加css类

我正在使用jQueryUI的autocomplete小部件，通过回调获取要显示的项目，如参考中所述

我有一个用例，在这个用例中，我需要呈现一些从服务器检索到的项目，这些项目与其他项目略有不同，以便用户理解这些项目之间的差异。在我的例子中，有些项目是“个人的”，有些是“全球的”

我想通过添加一个CSS类让“个人”项目脱颖而出，这样它们就有了稍微不同的背景

这可能吗？我在参考文档中看到，有一个插件允许我在“items”中添加任意HTML，但我觉得当我真正需要做的只是添加一个类（在某些情况下）时，这是次优的

我想我最终会得到这样的结果：

$("#myElement").autocomplete({
            //define callback to format results
            source: function(req, add){
                //pass request to server
                var baseUrl = '/getItems.php'
                $.getJSON(baseUrl, req, function(data) {

                    //create array for response objects
                    var suggestions = [];

                    //process response
                    $.each(data, function(i, val){
                        var entry = new Object();
                        if (val.personal == true){
                        // add some css class somehow?
                        }
                        entry.id = val.id;
                        suggestions.push(entry);
                    });

                    //pass array to callback
                    add(suggestions);
                });
            },

        });

根据示例判断，您需要点击自动完成的

\u renderItem

方法：

$("input").autocomplete({ ...  }).data("autocomplete")
    ._renderItem = function(ul, item) {
        var listItem = $("<li></li>")
            .data("item.autocomplete", item)
            .append("<a>" + item.label + "</a>")
            .appendTo(ul);

        if (item.personal) {
            listItem.addClass("personal");
        }

        return listItem;
    };

$（“输入”）.autocomplete（{…}）.data（“autocomplete”）
._renderItem=功能（ul，项目）{
变量listItem=$（“
”）
.data（“item.autocomplete”，item）
.append（“如果您使用的是JQuery UI 1.10及更高版本，则需要将代码更改为以下内容：即“.data（UI自动完成””）

$（“输入”）.autocomplete（{…}）.data（“ui自动完成”）
._renderItem=功能（ul，项目）{
变量listItem=$（“
”）
.data（“item.autocomplete”，item）
.append（“+item.label+”）
.附录（ul）；
如果（个人项目）{
listItem.addClass（“个人”）；
}
返回列表项；
};
这基本上与上所述的方法相同。我想应该是这样：）谢谢！
$("input").autocomplete({ ...  }).data("ui-autocomplete")
._renderItem = function(ul, item) {
    var listItem = $("<li></li>")
        .data("item.autocomplete", item)
        .append("<a>" + item.label + "</a>")
        .appendTo(ul);

    if (item.personal) {
        listItem.addClass("personal");
    }

    return listItem;
};