jquery-ui-autocomplete - 覆蓋_renderMenu和_renderItem

我已經使用jquery-ui實現了一個自動完成功能。我想限制顯示的項目數量爲10，並且每個項目都是自定義格式的。這裏是代碼jquery-ui-autocomplete - 覆蓋_renderMenu和_renderItem

$("#text1").autocomplete({ 
    minLength: 2, 
    source: function (request, response) { 
    var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i") 
    , results = []; 
    $.each(source, function (i, value) { 
    if (matcher.test(value.value) && $.inArray(value.label, results) < 0) { 
    results.push(value.label); 
    } 
    }); 

    response(results); 
    } 
}).data("autocomplete") 
     ._renderMenu = function(ul, items) { 
     var self = this; 
     $.each(items, function (index, item) { 
      if (index < 10) { 
       $.ui.autocomplete.prototype._renderItem = function(ul, item) { 
       var re = new RegExp("^" + this.term, "i"); 
       var t = item.label.replace(re, "<span style='font-weight:bold;color: Blue;'>" + "$&" + "</span>"); 
       var listItem = $("<li></li>") 
           .data("item.autocomplete", item) 
           .append("<a>" + t + "</a>") 
           .appendTo(ul); 
       return listItem; 

       } 
      } 
      }); 
     };

這似乎不工作，因爲它沒有投擲任何結果。有關於此的任何幫助？

來源

2012-08-09 Ankit Garg

我想通了。似乎我必須覆蓋_renderMenu和_renderItem。它現在有效。

來源

2012-08-09 09:27:24

嗨Anit，我有類似的問題。你有可能發佈工作代碼嗎？ – 2013-07-16 00:51:50

@ Beetroot-Beetroot您已經覆蓋了_renderMenu和_renderItem。代碼已深入挖掘。但這裏是你可以查看的參考http://stackoverflow.com/questions/2435964/jqueryui-how-can-i-custom-format-the-autocomplete-plug-in-results – 2013-07-16 02:35:19

@Akit，謝謝你你的快速回復。與此同時，我通過調用'._renderMenu'中的'._renderItemData'來得到一個結果來重現插件的標準行爲。這適用於我的情況，因爲我想要標準菜單項，但使用分隔符將菜單分成多個部分。再次感謝。 – 2013-07-16 03:18:10

jquery-ui-autocomplete - 覆蓋_renderMenu和_renderItem

回答

相關問題