JQuery Select2在bootbox对话框模式中无法正确显示

Question

当我在页面上使用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(); 选择下拉列表变为常规下拉列表.但我不知道为什么它显示不正确.

Answer 1

我不久前有同样的情况,我设法解决这个问题:

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

dialog我的bootbox模式对话框在哪里.您只需tabindex要从对话框本身中删除属性.这样它将按预期工作(就像它在正常页面中工作).