首先在head中引入<link href="../assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" />
前端控件：<input id="ckbCut" runat="server" name="ckbCtype" type="checkbox" class="make-switch" data-size="small" data-on-text="是" data-off-text="否" />
前端：
<script>
$(document).ready(function () {
//初始化switch插件
$(".make-switch").each(function () {
$(this).bootstrapSwitch();
});
if ($("#ckbCut").is(":checked")) {
$("#cutpayment").show();
} else {
$("#cutpayment").hide();
}
$("#ckbCut").on('switchChange.bootstrapSwitch', function (e, data) {
if (data) {
//將按鈕設為未選中狀態
說明：給按鈕設置狀態的時候，按鈕的狀態必須是可用的，否則不會起作用
$("#ckbCut").bootstrapSwitch('state', false, true);
} else {
//將按鈕設為選中狀態
$("#ckbCut").bootstrapSwitch('state', true, true);
}
//禁用
$("#ckbCut").bootstrapSwitch('disabled',false);
//可用
$("#ckbCut").bootstrapSwitch('disabled',true);
});
});
</script>
因為bootstrap-switch.min.css插件的版本不一樣，用法可能也會不一樣
后台：
獲取控件的值：ckbCut.Checked
給控件賦值：ckbCut.Checked = DBConvert.ToBoolean(pay.IsDeduct);