jQuery select2打开后立即自动关闭

Posted 2023-05-07

【中文标题】jQuery select2打开后立即自动关闭

【英文标题】：jQuery select2 automatic close immediate after opened

【发布时间】：2019-09-08 08:40:12

【问题描述】：

select2 在 bootstrap 4 modal 中，它只发生在 modal 中。

看上面的截图，当我点击元素时，它会显示，然后关闭。

在 chrome 控制台中，我看到了这些警告

[Violation] Avoid using document.write().
[Violation] Forced reflow while executing javascript took 33ms
[Violation] 'readystatechange' handler took 151ms

这是我的代码

$ele.select2(
    dropdownParent: $('#bootstrap4-modal'),
    ajax: 
        url: '/path/to/data',
        type: 'get',
        dataType: 'json',
        data: function (params) 
            return 
                q: params.term,
                start: ((params.page || 1) - 1) * 10,
                length: 10,
            ;
        ,
        processResults: function (data, params) 
            params.page = params.page || 1;
            return 
                results: data.results,
                pagination: 
                    'more': (params.page * 10) < data.total
                
            ;
        
    ,
);

操作系统：macOS Mojave Chrome：73.0.3683.103（64 位） 引导程序：v4.1.3 select2: v4.0.5 （带有 select2-bootstrap-theme/0.1.0-beta.10）

P/S：这并不总是发生

【参考方案1】：

我想我已经found a solution here，我错过的是.modal-content

dropdownParent: $('#bootstrap4-modal .modal-content'),

现在 select2 显示正确

【讨论】：

祝福你！我一直在努力解决这个问题！

最后，我没有模态框，但我的页面中仍有一些东西触发了焦点，所有没有搜索框的 select2 字段都立即关闭。奇怪的是，带有搜索框的“普通”字段工作正常。