如何在jquery / js中模仿此回调的功能？

Question

我用我制作的库替换了jQuery-ui自动完成库。 我的输入元素的旧初始化程序看起来像这样：

$('#search_input').autocomplete({
   minLength: 2,
   select: function(event, ui) {
     $('.some_element').val('ui.item.id');
     return false;
   }
});

我新的自动完成库如下所示：

$.fn.custom_search = function() {
  $(this).on('keydown click', (e) function(){
  switch e.type {
    case 'keydown':
      ...
      search_term = $(this).val();
      ajax_caller(search_term);
      break;
    case 'click'
      ...
      break;
  }

};

如何维护jQuery-ui自动完成功能的“选择”功能？ 我希望通过初始化程序中选择的所有内容，以从自定义自动完成功能的搜索结果中选择一个项目时触发。

'ajax_caller'函数将搜索项传递给控制器​​。 控制器将编译一个列表，并将其返回到js.erb，该js.erb创建搜索项结果的列表，并将其附加到输入的底部。

当有人从搜索字词结果中选择一个选项时，应该触发选择回调。

Answer 1

您需要将select回调作为选项传递给插件，如下所示：

$.fn.custom_search = function(options) {
  options = options || {};
  var select = options.select || function() {};
  $(this).on('keydown click', (e) function(){
  switch e.type {
    case 'keydown':
      ...
      search_term = $(this).val();
      select($(this), search_term);
      ...
  }

};

然后您将像jQuery自动完成一样传递它：

$('#search_input').custom_search({
   select: function(element, value) {
     $('.some_element').val('ui.item.id');
     return false;
   }
});

还要检查此jQuery插件模板 ，您可以找到更多类似的模板来帮助您编写结构良好的插件。