引导选择器在远程模式下不起作用答案

【问题标题】：Bootstrap selectpicker don't work in remote modal引导选择器在远程模式下不起作用
【发布时间】：2017-09-02 18:12:46
【问题描述】：

当我使用远程 Modal 时，我将类 selectpicker 添加到 example.php。它不显示结果。当我删除 select#selectpicker 时，它会显示可供选择的选项。

<button type="button" class="btn btn-primary" data-toggle="modal"
    href="example.php" data-target="#detail"> Example </button>
<div>q
    <div class="modal fade" id="detail" role="dialog">
        <div class="modal-dialog modal-lg ui-front">
            <div class="modal-content">
            </div>
        </div>
    </div>
</div>

Code example

【问题讨论】：

标签： bootstrap-selectpicker

【解决方案1】：

我没有在正文中看到选择选择器初始化。由于选择是从 .php 文件呈现的，因此在模式打开之前它不会成为 DOM 的一部分。

因此，您可以按以下方式初始化选择器以使其工作：（即一旦出现模式）：

<script>
$('body div#detail.modal').one('shown.bs.modal', function (e) { 
    $(this).find('div.modal-content select').selectpicker(); 
})
</script>

【讨论】：