Select2 4.0.5搜索框无法触发select2:selecting事件，求AJAX触发方案

嘿，我明白你遇到的问题了——Select2从旧版本升级到4.0.5后，事件体系做了不少调整，select2:selecting事件现在是在用户选择某个选项时才触发，根本不是搜索输入的时机。要实现每次在搜索栏输入内容就向服务器发AJAX请求，有两种靠谱的解决方案，看你的具体需求来选：

Select2 4.x本身就原生支持在用户输入搜索关键词时自动发起AJAX请求，完全不需要手动绑定额外事件，这也是官方推荐的标准用法，稳定性拉满。给你个示例代码：

// 替换成你的select元素ID
$('#your-select').select2({
  ajax: {
    url: '/your-server-api', // 你的服务器接口地址
    dataType: 'json',
    delay: 250, // 延迟250ms再发请求，避免输入太快导致频繁请求
    // 组装发送给服务器的参数
    data: function (params) {
      return {
        q: params.term, // 用户输入的搜索关键词
        page: params.page || 1 // 分页参数（如果你的接口支持分页的话）
      };
    },
    // 处理服务器返回的数据，转换成Select2能识别的格式
    processResults: function (data, params) {
      return {
        results: data.options, // 假设服务器返回的选项数组存在data.options里
        pagination: {
          more: (params.page * 10) < data.total // 判断是否还有更多数据
        }
      };
    },
    cache: true // 开启缓存，相同关键词不会重复发请求
  },
  placeholder: '请输入关键词搜索',
  minimumInputLength: 1 // 设置至少输入1个字符才触发AJAX请求
});

这个配置会自动监听搜索框的输入行为，满足条件时自动发请求、处理返回结果并渲染成选项，完美匹配你的需求。

如果你的业务有特殊需求（比如除了发AJAX还要做其他额外逻辑），可以手动监听Select2动态生成的搜索框的输入事件。因为搜索框是Select2初始化后才生成的，所以需要用事件委托：

// 先初始化Select2
$('#your-select').select2({
  placeholder: '请输入关键词搜索'
  // 其他基础配置
});

// 监听搜索框的输入事件
$(document).on('input', '.select2-search__field', function() {
  const searchTerm = $(this).val().trim();
  // 设置最小输入长度，避免空输入发请求
  if (searchTerm.length >= 1) {
    // 发送AJAX请求
    $.ajax({
      url: '/your-server-api',
      data: { q: searchTerm },
      dataType: 'json',
      success: function(response) {
        // 处理返回的数据，手动更新Select2的选项
        const optionElements = response.map(item => 
          new Option(item.label, item.value, false, false)
        );
        $('#your-select').empty().append(optionElements).trigger('change');
      }
    });
  }
});

这种方式需要自己处理选项的更新逻辑，不如内置AJAX配置方便，只推荐给有特殊自定义需求的场景。

另外补充一句：旧版本的select2-selecting事件在4.x里不仅改了命名（变成select2:selecting），触发时机也完全变了——现在它只在用户点击选中某个选项时触发，和搜索输入半毛钱关系都没有，所以你之前的用法自然失效啦。

内容的提问来源于stack exchange，提问作者Dominic M.