bootstrap-switch开关插件
官网地址 http://www.bootcss.com/p/bootstrap-switch/
先引入资源:
<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.bootcdn.net/ajax/libs/bootstrap-switch/3.3.4/css/bootstrap3/bootstrap-switch.min.css" rel="stylesheet"> <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/bootstrap-switch/3.3.4/js/bootstrap-switch.min.js"></script>
然后添加html:
<div id="wlan_enable_div" class="switch bootstrap-switch-small"> <input type="checkbox" id="chkappType" /> </div>
最后初始化:
$("#chkappType").bootstrapSwitch({
onText : "开",
offText : "关",
onColor : "primary",
offColor : "warning",
onSwitchChange : function() {
var checkedOfAll=$("#chkappType").prop("checked");
if (checkedOfAll==false){ //关
$(‘.schedule‘).find(‘textarea‘).prop(‘disabled‘,true);
}else { //开
$(‘.schedule‘).find(‘textarea‘).prop(‘disabled‘,false);
}
}
});
需要手动设置input的选中状态时,可以这样写:
$("#chkappType").bootstrapSwitch(‘state‘, true);
原文:https://www.cnblogs.com/xi-li/p/15232438.html