搜索时的Jquery select2自定义javascript函数

Posted 2023-05-07

【中文标题】搜索时的Jquery select2自定义javascript函数

【英文标题】：Jquery select2 custom javascript function when searching

【发布时间】：2016-05-28 20:26:20

【问题描述】：

我的页面中有多个 select2。 我有一个特定的 ajax 引擎，由于很多原因无法更改它。 我想在最终用户在字段中输入时填写每个 select2 下拉列表，并使用自制的 javascript 填写 select2 中的“选项”。

我尝试了很多在网上找到的不同的东西，但找不到合适的语法。

例如：

      jQuery("customer").select2(
          query: function (options) 
              alert('ok');
              // my ajax call would be here
              xajax_getCustomers(stringFilled);
          
      );

我已经尝试过使用“ajax:”和其他一些东西，但我找不到在填充内容时如何触发 javascript 函数。 重要提示：我应该能够填充字符串，以便将其传递给我的 ajax 调用

感谢您的帮助

【问题讨论】：

select2.github.io/examples.html#data-ajax你不需要自定义函数，select2插件自带了这个功能。

我已经看到了这些信息。但它适用于使用 JSON 的“标准”ajax 调用。这不是我的情况。我希望能够调用我自己的 javascript 函数

我添加了一个答案。告诉我它是否能解决您的问题

您使用的是哪个版本的 select2？ 3.5.x 还是 4.0.x？

【参考方案1】：

你有这个事件：

  $(selector).on("select2-highlight", function(e) 
      console.log("highlighted val=" + e.val + " choice=" + e.choice.text);
  )

它对搜索事件有效，因此当select2-highlight 事件被触发时，意味着用户正在搜索您可以使用e.val 和e.choice.text 值管理的字符串。

不幸的是没有严格的搜索事件，但你可以将插件的隐藏输入文本与on('keyup');绑定

类似这样的：

 $('input.select2-search__field').on('keyup', function() 
      alert($(this).val()); // it alerts with the string that the user is searching
 );

【讨论】：

我已经尝试过下面的代码，这很有效，我得到了填充的字符串，但我不知道它指的是哪个 select2。有什么想法知道吗？ jQuery(document).on("keyup",".select2-input", function (event) alert(jQuery(this).val()); );

用您的选择器更改document。如果您有一个带有id="mySelect" 的选择，这将转换为：jQuery('#mySelect').on('keyup', '.inputclass', .... );

如果我输入选择 ID 而不是文档则不起作用。

不是<select> id，我参考<div class="select2 ... " id="mySelect">

那么我可能还有另一个问题：我用经典的选择来做，但如果我用简单的 div 代替它就行不通。如果我这样做：jQuery("#customer").select2(); 我收到一个错误“未为 Select2 客户定义未捕获的查询函数”（jquery 3.5.2）然后我被卡住了......