获取 select2 中的当前元素

Question

我想通过使用 class 来使用多个 select2，就像我在自动完成中所做的那样，但是我在 select2 中没有这样做。

这是我的代码：

$('.select2-autocomplete').select2({
  placeholder: "Search",
  minimumInputLength: 1,
  multiple: true,
  ajax: {
    url: "http://example.com/autocomplete-results",
    dataType: 'json',
    data: function(term, page) {
      return {
        q: term,
        type: $(this.element).data('type')
      };
    },
    results: function(data, page) {
      return {
        results: data
      };
    }
  },
});

除此之外一切正常：

type : $(this.element).data('type')

这里我需要 select2 元素数据类型值，但它始终是未定义的，不知道我如何才能得到它？

谢谢

编辑：

<input type="hidden" data-type="products" name="products" class="select2-autocomplete">
<input type="hidden" data-type="customers" name="customers" class="select2-autocomplete">

我想显示来自 ajax 的不同结果，这就是我想通过 ajax

发送数据类型的原因

Answer 1

您可以在 select2:open 事件期间捕获活动元素，然后将其用于数据函数

这是我的例子：

(function(){
var theSelect2Element = null;
$('.select2-autocomplete').select2({
   ...
   data: function(term, page) {
      return {
        q: term,
        type: $(theSelect2Element).data('type')
      };
   },
   ...
}).on('select2:open', function(e){ 
   theSelect2Element = e.currentTarget; 
}))();

祝你好运！

Answer 2

您可以使用 $(this.context)，它将 return 原始 select 元素作为 jQuery 对象。

data: function(term, page) {
  return {
    q: term,
    type: $(this.context).data('type')
  };
},

获取 select2 中的当前元素

get current element in select2

javascript

jquery

jquery-select2