Question

我正在用我制作的jQuery-ui自动完成库替换它。我的input元素的旧初始化程序如下所示：

$('#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，它创建一个搜索词结果列表并将其附加到输入的底部。

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

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;
   }
});

同时检查this jQuery plugin template，您可以找到更多类似的模板来帮助您编写结构良好的插件。

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

1 个答案: