您的位置:首页 > Web前端 > BootStrap

bootstrap-switch使用实例

2016-01-08 13:29 651 查看
1.引入js,css文件

<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-switch.min.css" rel="stylesheet">
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-switch.min.js"></script>


这些文件需要到bootstrap官网中下载

2.html代码

<label class="control-label" for="push">是否同时推送</label>
<div class="switch" style="height:30px;">
<input id="push" type="checkbox"/>
</div>


3.调用switch 的 js文件使之生效

$(document).ready(function(){
$("#push").bootstrapSwitch({
onText:'推送',
offText:'不推送'
});
});


4.效果如下





更多样式与效果请看bootstrap官方文档
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: