所以我试图将从JSON字符串解析的对象中的值传递到jQueryUI自动完成的东西，我试图从2维数组中获取三个不同的值，如：
[{1:a1, 2:b1,3:c1,4:d1},{1:a1, 2:b1,3:c1,4:d1}]
这只是对象的表示，但我在一个结果项中需要三个值。
所以无论我尝试什么，都会发生以下两种情况之一：
1）当我使用以下代码（从the jQueryUI site修改]，以及来自jQueryUI网站的css文件时，我得到以下结果：
.data("ui-autocomplete")._renderItem = function(ul, item) {
return $("<li>")
.attr("data-value", item[1])
.append("<a>")
.append("<span class='cardName'>" + item[1] + "</span>")
.append("<span class='setName'>" + item[3] + "</apan>")
.append("<span class='rarity'>" + item[2] + "</span>")
.append("</a>")
.appendTo(ul);
}
这也是我自己使用的CSS：
.cardName { float:left; width:70%; font-weight:bold; text-align:left; }
.setName { float:right; width:10%; text-align:right; }
.rarity { float:right; width:15%; text-align:right; }
这就是它的样子：
(screenshot here) http://oi43.tinypic.com/33m1xr6.jpg
首先看起来不错，但选择区域只有几个像素高，根本不符合文字。
然后，当我尝试使用以下内容时：
.data("ui-autocomplete")._renderMenu = function(ul, item) {
var that = this;
$.each( items, function( index, item ) {
that._renderItemData( ul, item ); //(Also tried that._renderItem(ul,item))
});
}
所有文字都消失了，选择区域仍然太小，但鼠标悬停选择似乎更顺畅。我试图找到一种方法来保持平滑，但每个菜单项需要是正确的大小并显示文本。我已经尝试过搜索Google了，我发现了一些有关覆盖_renderItem和_renderMenu函数的内容，但我对JavaScript很陌生，虽然我尝试过看起来很糟糕，但我可能还没有完成它正确，因为它仍然无法正常工作。
我希望有人能告诉我如何让它正常工作。
答案 0 :(得分：0)
这不是.append的工作方式。 .append("<a>")实际上会立即附加一个结束标记（换句话说，它等同于.append("<a></a>")。您需要构建一个包含spans的锚标记，然后附加 到你最终返回的li：
.data("ui-autocomplete")._renderItem = function(ul, item) {
var href = $('<a />')
.append("<span class='cardName'>" + item[1] + "</span>")
.append("<span class='setName'>" + item[3] + "</apan>")
.append("<span class='rarity'>" + item[2] + "</span>");
return $('<li />')
.attr("data-value", item[1])
.append(href)
.appendTo(ul);
}