bootstrap-switch使用

bootstrap 的開關。

引入相關文件：

<link href="https://cdn.bootcss.com/bootstrap-switch/4.0.0-alpha.1/css/bootstrap-switch.min.css" rel="stylesheet">

<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>

<script src="https://cdn.bootcss.com/bootstrap-switch/4.0.0-alpha.1/js/bootstrap-switch.min.js"></script>

HTML代碼：

<input type="checkbox" name="useState"/>

JavaScript代碼：

$("[name='useState']").bootstrapSwitch({
                    size:"large",
                    onText:"啟用",
                    offText:"禁用",
                    onColor:"success",
                    onSwitchChange:function(event,state){
                        if(state==true){
                            $(this).val("2");
                        }else{
                            $(this).val("1"); // 禁用
                        }
                    }
                });

設置開或者關：

$('[name="useState"]').bootstrapSwitch("state", true);
// true 為 開，false 為 關

 

參考鏈接