jquery - 如何将单个项目附加到 jQuery UI 自动完成结果集下拉列表中？

Question

有没有办法将一个项目附加到包含 1-5 个项目的自动完成下拉列表的末尾？我使用了 open，但由于我在加载时将微调器附加到下拉列表中，因此效果不佳。

jQuery:

$("#search").autocomplete({
  source: function(request, response) {
    response([{loading: true}]);
    return $.ajax({
      url: "/search",
      timeout: 10000,
      dataType: "json",
      data: {
        query: request.term
      },
      success: function(data) {
        var results;
        results = [];
        results = $.map(data, function(result) {
          return {
            label: result.name,
          };
        });
        return response(results);
      }
    });
  }
  //open doesn't work because I have a spinning effect that opens a dropdown
  //when the search is loading.
  //open: function() {
  //  alert('test');
  //}
})
.data( "autocomplete" )._renderItem = function( ul, item ) {
  if(item.loading) {
    return $( "<li id='spinner'></li>" )
      .appendTo( ul );
  }
};

谢谢!

Answer 1

您应该能够将想要的任何项目push到结果列表中，然后再将其发送到response回调:

$("#search").autocomplete({
    source: function(request, response) {
        response([{loading: true}]);
        $.ajax({
            url: "/search",
            timeout: 10000,
            dataType: "json",
            data: {
                query: request.term
            },
            success: function(data) {
                var results = $.map(data, function(result) {
                    return {
                        label: result.name,
                    };
                });

                results.push({ label: "My Custom Item" });
                response(results);
            }
        });
    }
});

示例: http://jsfiddle.net/m3MGH/1/