bootstrap switch控件使用问题

Question

如图第一行按钮 是写的死的 有点击效果，可是后边的都没有点击效果 我怎么修改？

                     <table>
                        <tr>
                            <th>工资条表头</th>
                            <th>是否开启</th>
                        </tr>
                        <tr>
                            <td><input class="my-checkbox" type="checkbox" name="my-checkbox4" checked></td>
                            <td><input class="my-checkbox" type="checkbox" name="my-checkbox4" checked></td>

                        </tr>
                        <tr ng-repeat="item in tem_set">
                            <td>{{item}}</td>
                            <td><input class="my-checkbox" type="checkbox" name="my-checkbox4"></td>
                        </tr>
                    </table>
<script>
    $(function () {
        $(".my-checkbox").bootstrapSwitch({size: 'mini'});
    })
</script>

Answer 1

可以监听切换事件

<script>
        $(function () {
            $("[name='my-checkbox4']").bootstrapSwitch({
                onSwitchChange: function (e, data) {

                    console.log($(e.currentTarget));//当前元素dom的jquery对象
                    console.log(data);//true代表on，false代表off
                }
            });
        })
    </script>

具体自己可以测试下