自動完成的自定義數據/佈局

Question

我試圖在結果集的末尾追加<li>而沒有成功。我對結果集的長度一無所知，因爲它可以根據輸入而改變，所以我的計數器只有在結果達到極限時才設置。

我發現on the jquery ui site的文檔對我有幫助。

我事先啓動了一個計數器，並設置了條件來根據窗口變量對一些數據進行排序。以下是我與合作：

$('#q').autocomplete({...}).data("autocomplete")._renderItem = function(ul, item) { 
     if(autoCount == 0){ 
      $('<img src="/ac-top-arrow.png" class="ac-top-arrow" />').appendTo(ul); 
     } 

     if(item.window){ 
      var inLi = $('<li class="in-window"></li>') 
      .data("item.autocomplete", item) 
      .append('<a><img src="'+item.thumb+'" width="55" height="75" class="imgposter" /><div class="movie-info"><h1>'+item.title + '</h1> <span>('+item.year+')</span><br>' + '<h2>Watch now</h2></div></a>'); 

      if($('ul.ui-autocomplete li.in-window').length){ 
       $('.in-window:last').after(inLi); 
      } else if($('ul.ui-autocomplete li.out-window').length) { 
       $(inLi).addClass('first-in-win'); 
       $('.out-window:first').before(inLi); 
      } else { 
       $(inLi).addClass('first-in-win'); 
       $(inLi).appendTo('ul.ui-autocomplete'); 
      } 
     } 
     else { 
      var outLi = $('<li class="out-window"></li>') 
      .data("item.autocomplete", item) 
      .append('<a><h1>'+item.title + '</h1> <span>('+item.year+')</span></a>'); 

      if($('ul.ui-autocomplete li.out-window').length){ 
       $('.out-window:last').after(outLi); 
      } else { 
       $(outLi).addClass('first-out-win'); 
       $(outLi).appendTo(ul); 
      } 
      if(autoCount == 5){ 
       $(outLi).addClass('after-top'); 
      } 
     } 


     autoCount++; 

     if(autoCount == 6){ 
      $('<li class="bottom"><a href="">> See All Results</a></li>').appendTo(ul); 
      autoCount = 0; 
     } 
    }; 

Answer 1

這實現了我想要的東西：

'open': function(e, ui) {$('.ui-autocomplete').append('<li class="bottom ui-menu-item"><a href="#" id="see-more-results">> See All Results</a></li>');}