jQuery UI 组合框空值渲染

Question

我正在使用自定义的组合框 jquery ui 小部件（类似于这个http://jqueryui.com/autocomplete/#combobox）

问题是具有空值（“”或“”）的项目呈现如下：

<li class="ui-widget-content ui-menu-divider"><a><strong></strong> <strong></strong></a></li>

代替：

<li title="lib" class="ui-menu-item" id="ui-id-36" tabindex="-1"><a><strong></strong>lstrong></strong>i<strong></strong>b<strong></strong></a></li>

这会导致列表中显示一个分隔符而不是空白行。

我的自定义 _renderItem 如下所示：

input.data("uiAutocomplete")._renderItem = function(ul, item) {
                    return $("<li title='"+item.value+"'></li>").data("ui-autocomplete-item", item).append("<a>" + item.label + "</a>").appendTo(ul);
                };

jQuery 在哪里更改空值以显示为分隔符？ （可能值得注意的是，这适用于旧版本的 jQuery（1.4.2）和 jQuery UI（1.8.3）并且在尝试升级时现在停止工作）

TIA！

Answer 1

我发现了这个： http://api.jqueryui.com/menu/#method-_isDivider 这就是我的答案...

这是您将如何覆盖用于自动完成菜单的默认 _isDivider 函数：

input.data("uiAutocomplete").menu._isDivider= function( item ) {
                      return false;
                }

Answer 2

Looking at this sourcefile，第 6792 行说

    this.menu = $( "<ul>" ).menu({...});

因此，自动完成功能在内部使用 ui.menu 小部件。另一方面，菜单小部件在其 refresh 函数中包含此内容（同一文件中的第 11727 行）：

    // Initialize unlinked menu-items containing spaces and/or dashes only as dividers
    menus.children( ":not(.ui-menu-item)" ).each(function() {
        var item = $( this );
        // hyphen, em dash, en dash
        if ( !/[^\-\u2014\u2013\s]/.test( item.text() ) ) {
            item.addClass( "ui-widget-content ui-menu-divider" );
        }
    });

所以，最简单的解决方案：添加与该正则表达式不匹配的文本。我推荐转义字符：

... .append($("<a>").html("&#27;" + item.label))...