select2 - JQuery Select2 在引导框对话框模式中无法正确显示

当我在页面上使用 JQuery Select2 时它工作正常。但是，当它在引导框对话框模式中时，它显示不正确。



这是我正在使用的 jquery 代码...

$.ajax({
        type: 'GET',
        url: src,
        success: function (data) {
            if (allowed) {
                bootbox.dialog({
                    title: dialogTitle,
                    message: $('#altForm'),
                    onEscape: true,
                    show: false // We will show it manually later
                }).on('shown.bs.modal', function () {
                    $('#enterBtn').hide();
                    $('#userPwd').hide();
                    $('.app-ctrl').prop('disabled', true);
                    $('#altForm').show();
                }).on('hide.bs.modal', function (e) {
                    $('#altForm').hide().appendTo('body');
                }).modal('show');
                $('.boop').parents('.bootbox').removeAttr('tabindex');
                $('.boop').select2();
            }
        }
    });

我相信 Select2 下拉列表的代码正在工作，因为当我注释掉初始化行时: $('.boop').select2();选择下拉菜单变成了常规下拉菜单。但我不知道为什么它显示不正确。

最佳答案

不久前我遇到了同样的情况，我设法解决了这个问题:

dialog.on('shown.bs.modal', function() {
  dialog.removeAttr("tabindex");
});

其中 dialog 是我的引导框模式对话框。您只需要从对话框本身中删除 tabindex 属性。这样它就会按预期工作(就像在普通页面中工作一样)。

关于select2 - JQuery Select2 在引导框对话框模式中无法正确显示，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/42385714/