动态添加时引导选择器不工作

Question

我正在尝试通过附加 Html 代码（带有内容的 div）来动态添加新选项卡。 我这样做是：

1. 使用标签内容创建一个 div，其中包括所有（引导程序）SelectPicker

    <div id="main_div">
        ...
        <label for="title" class="label-heading"> First Name </label>
        <select multiple class="form-control" name="last_name" id="last_name"
        </select>
        ...
    </div>
   

2. 之后 - 我通过使用 getElementById 及其 innerHtml 获得了 div HtmlElement

   var tabs = $("#container").tabs();
   ..
   ..
   var div_content = document.getElementById("main_div").innerHtml;
   

3. 然后 - 将 Html 元素（在 secrion 2 中看到的 innerHtml）附加到选项卡。

   tabs.append(div_content);
   

问题在于，这样做似乎导致控件 SelectPicker 和日期选择器功能出现故障 - 从下拉列表中选择项目（在 SelectPicker 中） - 什么也不做。

知道为什么引导控件（selectPicker 和 DatePicker）在选项卡中不起作用吗？

谢谢。

Answer 1

添加后需要刷新选择器：

$('.selectpicker').selectpicker('refresh');