Javascript jQuery自动完成：以不同方式显示某些对象？

我正在运行RubyonRails应用程序，并使用jQuery在表单中显示一些自动完成建议。自动完成建议来自两个不同的数组，我将它们合并成一个数组，然后显示出来

现在，问题是我需要以不同于另一个文件的方式显示一个文件的结果。我该怎么做？也就是说，它们都将位于同一个自动完成框中，但其中一个的结果可能具有不同的字体、颜色等（单独的CSS挂钩？）

autocomplete.js：

位置\u controller.rb：

  def autocomplete
    respond_to do |format|
      format.js do
        client = GooglePlacesAutocomplete::Client.new(:api_key => "mykey")
        locations = client.autocomplete(:input => params[:term], :lat => "x", :lng => "y", :radius => "25000")
        add = Location.all.map { |l| { :label => l.address, :value => l.address } }
        locations = locations.predictions.map { |l| {:label => l.description, :value => l.description} }
        final = add + locations
        render :json => final
      end
    end
  end

如您所见，

locations\u controller

只需将两个串联数组的JSON对象呈现给URL

/locations/autocomplete.js

，而

autocomplete.js

则呈现该URL

我意识到我可能需要修改控制器以返回两个单独的JSON对象，一个用于

add

，另一个用于

location

。我可以做到这一点，但我不知道如何在最终的自动完成中将它们合并在一起，以及如何以不同的方式格式化来自它们的查询

我在javascript/jquery方面非常缺乏经验，因此我希望您能给出一个能很好地解释这些组件的答案，即使您对Rails应用程序所需的更改稍加掩饰

这就是问题的症结所在：

当我查看自动完成框的HTML时，每个自动完成项如下所示：

<li class="ui-menu-item" role="menuitem">
<a class="ui-corner-all" tabindex="-1">(autocomplete suggestion)</a>
</li>

通过修改
.renderItem
函数可以添加一个额外的类，但是我如何将其应用于某个JSON对象中的每个元素（js方法），或者如何将其预先应用于ruby数组中的每个元素（通过rails）？
关于必须使用
\u renderItem
函数的说法是正确的。使用此方法，您可以将任何想要的类应用于
li
或底层
a
，只要您包含小部件所需的数据

我只需要从您的ruby代码中发送另一个变量（对不起，根本不懂ruby），它指定这是否是一个地址（或者您想要分支以更改格式的任何属性）

然后，您可以这样编写
\u renderItem
函数：

$("#auto").autocomplete({
    source: source
}).data("autocomplete")._renderItem = function(ul, item) {
    var listItem = $("<li></li>")
        .data("item.autocomplete", item)
        .addClass(item.isAddress ? "address" : "landmark");

    if (item.isAddress) {
        listItem.html("<a>" + $.map(item.label.split(","), function(el) {
            return "<span class='addressline'>" + el + "</span>";
        }).join('') + "</a>");
    } else {
        listItem.html("<a>" + item.label + "</a>");
    }

    return listItem.appendTo(ul);

};

$（“#自动”）.autocomplete({
资料来源：资料来源
}).数据（“自动完成”）。\u renderItem=功能（ul，项目）{
变量listItem=$（“
”）
.data（“item.autocomplete”，item）
.addClass（item.isAddress？“地址”：“landmark”）；
如果（项目.isAddress）{
listItem.html("
对不起，我对JS的了解不多。我应该在JS中的哪里定义
isAddress？
函数，如果某个JSON对象中有一个元素，如何使其返回true，如果是另一个JSON对象，如何使其返回false？这样我可以将特殊地址作为单独的JSON返回，然后以不同的格式进行格式化。您可以发送
isAddress
删除已从服务器端代码发送回的数据。在构建地址数组时，请包含一个对地址始终为真的
isAddress
属性。对于其他列表，您可以完全忽略它。
$("#auto").autocomplete({
    source: source
}).data("autocomplete")._renderItem = function(ul, item) {
    var listItem = $("<li></li>")
        .data("item.autocomplete", item)
        .addClass(item.isAddress ? "address" : "landmark");

    if (item.isAddress) {
        listItem.html("<a>" + $.map(item.label.split(","), function(el) {
            return "<span class='addressline'>" + el + "</span>";
        }).join('') + "</a>");
    } else {
        listItem.html("<a>" + item.label + "</a>");
    }

    return listItem.appendTo(ul);

};