使用JQUERY实现多列自动完成 列表项

我正在查看JSFIDLE网站中链接上的JQUERY示例

这一特点给我留下了深刻的印象。事实上，我们必须在应用程序上实现完全相同的功能

如果我照原样复制代码，我就能看到多列自动完成。但是，选择部分不起作用。如果我选择使用鼠标光标或使用箭头键，程序将失败

我得到的错误是

“htmlfile:对方法或属性访问的意外调用。”

在jQuery-1.7.2.js中jQuery.fn.extend代码的append函数中

mcautocomplete小部件位于MVC中脚本文件夹下的自定义js文件中

你能帮忙吗

$.widget('custom.mcautocomplete', $.ui.autocomplete, {
    _renderMenu: function(ul, items) {
        var self = this,
            thead;

        if (this.options.showHeader) {
            table = $('<div class="ui-widget-header" style="width:100%"></div>');
            $.each(this.options.columns, function(index, item) {
                table.append('<span style="padding:0 4px;float:left;width:' + item.width + ';">' + item.name + '</span>');
            });
            table.append('<div style="clear: both;"></div>');
            ul.append(table);
        }
        $.each(items, function(index, item) {
            self._renderItem(ul, item);
        });
    },
    _renderItem: function(ul, item) {
        var t = '',
            result = '';

        $.each(this.options.columns, function(index, column) {
            t += '<span style="padding:0 4px;float:left;width:' + column.width + ';">' + item[column.valueField ? column.valueField : index] + '</span>'
        });

        result = $('<li></li>').data('item.autocomplete', item).append('<a class="mcacAnchor">' + t + '<div style="clear: both;"></div></a>').appendTo(ul);
        return result;
    }
});

$.widget（'custom.mcautocomplete'，$.ui.autocomplete{
_renderMenu：功能（ul，项目）{
var self=这个，
thead；
if（this.options.showHeader）{
表=$（''）；
$.each（this.options.columns，函数（索引，项）{
表.追加（“”+item.name+“”）；
});
表.附加（“”）；
ul.附加（表）；
}
$。每个（项目、功能（索引、项目）{
自我评估（ul，项目）；
});
},
_renderItem：功能（ul，项目）{
变量t=“”，
结果=''；
$.each（this.options.columns，函数（索引，列）{
t+=''+项[column.valueField？column.valueField:索引]+''
});
结果=$（'
）.data（'item.autocomplete'，item.append（''+t+''）.appendTo（ul）；
返回结果；
}
});

其他调查结果： 该代码以小提琴的形式工作

---

这段代码在Chorme或FireFox中不会崩溃。

我也有同样的问题。jQuery UI 1.10已更改的键，通过该键自动完成保存，然后检索菜单中一行的项数据。以前，键是“item.autosomplete”，现在是“ui autocomplete item”。因此，找不到数据且无法显示

以最新版本的MulticolumnAutocomplete为例

您还可以更改该行

result = $('<li></li>')
     .data('item.autocomplete', item)
     .append('<a class="mcacAnchor">' + t
              + '<div style="clear: both;"></div></a>').appendTo(ul);

result=$（“
”）
.data（'item.autocomplete'，item）
.append（“”+t
+''）。附录（ul）；

到

result=$（“
”）
.data（'ui-autocomplete-item'，item）
.append（“”+t
+''）。附录（ul）；

使用以下SQL代码：

SELECT column-duplicate
    FROM TABLE 
GROUP BY column-duplicate
  HAVING COUNT(column-duplicate) > 1

---

有没有可能你可以设置一个演示这个问题的程序？它在我刚刚设置的fiddle中工作，但是在VS2010中创建的ASP MVC4项目中不工作。

SELECT column-duplicate
    FROM TABLE 
GROUP BY column-duplicate
  HAVING COUNT(column-duplicate) > 1