bootstrap开关不适用于动态创建的复选框输入

Question

我有以下脚本组合： jquery ， bootstrap ，现代化程序， json2html 。

调用类似的东西：

<script>
   $('#my01Switch').bootstrapSwitch({
            onText: 'ON',
            offText: 'OFF',
            size: 'large',
            onColor: 'success',
            offColor: 'warning',
            labelText: '*'
        });
    </script>

在关闭正文标记之前，在：

<input name="my01Switch" id="my01Switch" data-toggle="switch" checked="" type="checkbox">

以上是动态生成的输入标签。

请帮忙。

Answer 1

在执行bootstrap switch插件之前检查文档是否准备就绪：

$(document).ready(function() {
    //Code
});

更新开关复选框代码：

在复选框中添加一个类

<input name=\"my01Switch\" id=\"my01Switch\" type=\"checkbox\"  data-toggle=\"switch\" checked=\"true\" class=\"custom-box\"/>

更新js代码：

function renderRooms(json)
{
    if (json !== undefined) {

        //.....

        //$('#roomBoxWrap').json2html(json, transforms.theRoom);
        $('#form-nav').json2html(json.rooms, transforms.menurooms);
        $('#title_room_name').append(getRoomName(json));

        //After the rooms are loaded
        $('.custom-box').bootstrapSwitch();
    }
}