jquery-select2 - Select2 在引导模式中不起作用

标签 jquery-select2

我正在尝试使用 select2在引导模式内,但它没有自动获得焦点,并且向下和向上箭头不适用于填充列表。

当我将它放在模态弹出窗口之外时,相同的 select2 工作。

当我搜索时,我发现很多人都面临同样的问题,并找到了这篇文章

Select2 doesn't work when embedded in a bootstrap modal

我从中实现了两个解决方案

  • 已删除 tabindex从模态弹出。
  • enforceFocus的评论代码modal.js 文件中的函数。

  • 但它仍然无法正常工作!知道我可能还缺少什么吗?

    编辑 1

    它适用于 firefoxtabindex已从模态 div 中删除,但未与 IE9 一起删除

    编辑 2

    我发现删除 tabindex实际上并没有被 IE9 认可因为我仍然可以在 IE 中通过转义键隐藏弹出窗口,但不能在 Firefox 中。

    最佳答案

    把它放在你的 JS 中的某个地方:

       //fix modal force focus
       $.fn.modal.Constructor.prototype.enforceFocus = function () {
          var that = this;
          $(document).on('focusin.modal', function (e) {
             if ($(e.target).hasClass('select2-input')) {
                return true;
             }
    
             if (that.$element[0] !== e.target && !that.$element.has(e.target).length) {
                that.$element.focus();
             }
          });
       };
    

    关于jquery-select2 - Select2 在引导模式中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20835872/

    相关文章:

    jquery-select2 - 是否可以更改选择字段中的输入?

    javascript - 排序 select2 中的波兰字母

    php - Select2 Ajax Laravel - 结果未显示

    javascript - select2 显示不正确(使用 cdn)

    javascript - Select2 Ajax 方法不选择

    javascript - 无法在 JavaScript 中循环数组

    Jquery select2 ajax 链式选择

    javascript - 禁用按钮,直到填写表格(选择没有效果)

    jquery - 移动设备上的 select2 键盘问题

    javascript - select2 多重选择 - 选择一个组及其所有子项,但在未选择该组时允许选择多个子项