javascript - 覆盖 _renderItem 和 _renderMenu

Question

如何仅覆盖 _renderItem #global-search？

$("#global-search").autocomplete({
   //       
})._renderMenu = function(ul, items) {
   var self = this;
   ul.append('<table class="ac-search-table"></table>');
   $.each( items, function( index, item ) {
     self._renderItem( ul.find("table"), item );
   });
});

Answer 1

请记住，您可以通过以下方式处理由 jQuery UI 工厂方法 ( _create)创建的小部件的特定实例data：

var widgetInst = $("#global-search").autocomplete({}).data('ui-autocomplete');

...或者，从 jQuery UI 1.12 开始，通过instance()辅助方法：

var widgetInst = $("#global-search").autocomplete('instance'); 

因此，您可以用自己的方法覆盖其方法：

widgetInst._renderMenu = function(ul, items) {
  var self = this;
  ul.append('<table class="ac-search-table"></table>');
  $.each( items, function( index, item ) {
    self._renderItem( ul.find("table"), item );
  });
};

Answer 2

你有几个选择：

1. 您可以覆盖该_renderItem函数，以便它在内部进行一些对象比较，并调用原始_renderItem函数或执行您的自定义代码。

2. 您可以创建一个继承autocomplete并覆盖那里的功能的新小部件。