jquery - 自定义jquery自动完成html

Question

我正在使用 jquery 自动完成，我想将自动完成 ul 包装在一个 div 中我正在使用这些代码来自定义输出 li 以包含图像，但我想将它包装在一个 div 中

  $( "#searchy-input" ).autocomplete({
    minLength: 2,
    source: "/search_suggestions",
    focus: function( event, ui ) {
      $( "#searchy-input" ).val( ui.item.name );
      return false;
    }


   })
    .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
   return $( "<li class='customClass'>" )
       .append( "<a href='"+item.link+"'><div class='_20'><img class='_80 hg30p' src='"+ item.avatar+"'/></div><div  class='span1 mg _60'>" + item.name + "</div></a>" )
       .appendTo( ul );
}

类似这些教程的东西

http://www.webdesignerdepot.com/2012/05/foxycomplete-advanced-autocomplete-search-images/ 再次搜索后，我发现解决 ul 的 html 显示的解决方案来自这些私有方法

_renderMenu: function( ul, items ) {
  var that = this;
 $.each( items, function( index, item ) {
  that._renderItemData( ul, item );
 });
 $( ul ).find( "li:odd" ).addClass( "odd" );

}

Answer 1

根据您的评论，您的问题似乎在于包装 UL 元素，而不是._renderItem功能。

话虽如此：

$('ul').wrap('<div></div>');

会成功的。

http://api.jquery.com/wrap/文档链接。