jquery - 如何捕获 select2 的 Enter 按键

标签 jquery jquery-select2

我有一个国家/地区的 select2 下拉菜单(多选)。当用户输入关键字时,它会在菜单中显示相关项目。
例如,如果用户输入 ind,菜单将显示 印度印度尼西亚。 如果按下 Enter 键,则选择第一个项目(印度)。这是默认行为。

现在,我想在用户输入 ind 并按 Enter 键时选择这两个国家/地区。

$(".select2-search__field").on("keyup",  function (e) { 
    console.log(e.keyCode);       
    if (e.keyCode == 13) {
        alert();
    }
});

使用上述代码,控制台日志会显示 ind,但不会显示 Enter 键,因此警报永远不会显示。
我猜想默认的 select2 行为会阻止我的代码被触发。

我应该做什么,以便我可以捕获回车键按下的情况。

https://jsfiddle.net/bwp0svq6/1/

最佳答案

按键事件已被弃用。您可能想使用 keydown 来代替。

$(document).ready(function() {
  $('#example').select2();

  $(".select2-search__field").on("keydown", function(e) {
    if (e.keyCode == 13) {
      alert();
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://rawgit.com/select2/select2/master/dist/js/select2.js"></script>
<link href="https://rawgit.com/select2/select2/master/dist/css/select2.min.css" rel="stylesheet" />

<select id="example" multiple="multiple" style="width: 300px">
  <option value="1">Argentina</option>
  <option value="2">Brazil</option>
  <option value="3">China</option>
  <option value="4">India</option>
  <option value="5">Indonesia</option>
</select>

关于jquery - 如何捕获 select2 的 Enter 按键,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55037611/

相关文章:

javascript - 浏览器在 javascript 函数完成执行之前不显示消息

Jquery(或 CSS)将 iframe 自动调整到底部?

javascript - 可搜索选择输入,无需 JS 初始化

Django select 2 多选加载慢

javascript - 将选项添加到我的 Select2

jquery - 动态更改通知背景

jquery - 多个 jquery 效果在我的 html 脚本中不起作用

jquery-select2 - 在 select2 建议列表中突出显示键入的字符未显示

javascript - 重置 select2 上的所有选项并加载另一个数据集

javascript - 使用 javascript/jquery 按正确顺序插入 div 元素