将 jQuery UI 从 1.8 更新到 1.12 时，Catcomplete 小部件停止工作

Question

这是我的代码，一直运行良好，直到我更新到 jQuery UI 1.12

var currentCategory = "";
$.widget("custom.catcomplete", $.ui.autocomplete, {
    _renderMenu: function (ul, items) {
        var self = this;
        $.each(items, function (index, item) {
            if (item.category != currentCategory) {
                ul.append("<li class='ui-autocomplete-category'>" + item.category + "</li>");
                currentCategory = item.category;
            }
            self._renderItem(ul, item);
        });
    },
    _renderItem: function (ul, item) {
        var clase = '';
        switch (item.category) {
        case 'Usuarios':
            return $("<li class='" + clase + "'></li>")
                .data("item.autocomplete", item)
                .append("<a><img src='" + item.img + "' /><span class='name'>" + item.value + "</span></a>")
                .appendTo(ul);
            break;
        case 'Posts':
            return $("<li class='" + clase + "'></li>")
                .data("item.autocomplete", item)
                .append("<a><img src='" + item.img + "' /><span class='name'>" + item.value + "</span><span class='sub'><i class='fa fa-bookmark-o'></i> " + item.sub + "</span> <span class='sub'>" + item.votos + "<i class='fa fa-thumbs-o-up'></i></span> </a>")
                .appendTo(ul);
            break;
        }
    }
});

这就是我的使用方式：

$("#recipeName").catcomplete({
        source: "/jsonR.php",
        minLength: 2,
        selectFirst: true,
        select: function (event, ui) {
            console.log(ui); /* this logs Object item:undefined */
            var url = '';
            if (ui.item.category == 'Posts') {  /* This is line 1692 */
                url = 'http://example.com/page.php?id=' + ui.item.id;
            }
            location.href = url;
            return false;
        },
        selectFirst: true,
        open: function () {
            $('.ui-autocomplete').addClass('searchBox');
            currentCategory = "";
        }
    });

此代码正确呈现列表，问题是当我 select 一个选项时：

cached.js:1692 Uncaught TypeError: Cannot read property 'category' of undefined(…)

知道我应该从这段代码中重新改编什么才能使用 jquery ui 1.12 吗？

-编辑-

我注意到如果使用 self._renderItemData(ul, item) 而不是 self._renderItem(ul, item)，selection 有效，

问题是当我将鼠标悬停在一个元素上时出现错误（光标不是指针..）：

jquery-ui.js:5840 Uncaught TypeError: Cannot read property 'value' of undefined(…)

这是 jquery 上的第 5840 行 ui:

// Announce the value in the liveRegion
label = ui.item.attr( "aria-label" ) || item.value;

有什么想法吗？

Answer 1

我错过了 _create 方法，我不确定在旧版本中是否需要它

$.widget("custom.catcomplete", $.ui.autocomplete, {
   _create: function() {
            this._super();
            this.widget().menu( "option", "items", "> :not(.ui-autocomplete-category)" );
    }
    // Rest of code..
});

将 jQuery UI 从 1.8 更新到 1.12 时，Catcomplete 小部件停止工作

Catcomplete widget stopped working when updating jQuery UI from 1.8 to 1.12

javascript

jquery

jquery-ui

jquery-widgets