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

bonelee 阅读:90 2024-02-27 23:08:18 评论:0

当我在页面上使用 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来自对话框本身的属性。这样它就会按预期工作(就像在普通页面中工作一样)。


标签:jquery
声明

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

关注我们

一个IT知识分享的公众号