在bootstrap中,switch用于给选择框设置类似于开关的样式,是实现复选框美化开关的bootstrap插件,调用语法为$(选择框元素).bootstrapSwitch();。
bootstrap中switch的用法是什么
Bootstrap Switch是一款通过复选框美化实现的一款开关控件,可以给选择框设置类似于开关的样式,它是依赖于Bootstrap的一款插件。
下载
官网地址 : https://www.bootcdn.cn/bootstrap-switch/
GitHub下载地址 : https://github.com/Bttstrp/bootstrap-switch
导入
<linkrel="stylesheet"type="text/css"href="css/bootstrap.min.css"><linkrel="stylesheet"href="css/bootstrap-switch.min.css"><scriptsrc="js/jquery-3.4.1.min.js"></script><scriptsrc="js/bootstrap.min.js"></script><scriptsrc="js/bootstrap-switch.min.js"></script>
使用
//定义一个选择框<inputtype="checkbox"name="test">//给选择框应用样式<scripttype="text/javascript">$("[name='test']").bootstrapSwitch();</script>
属性
常用的属性:
size :开关大小。可选值有 mini, small, normal, large
onColor:开关中开按钮的颜色。可选值有 primary, info, success, warning, danger, default
offColor:开关中关按钮的颜色。可选值 primary, info, success, warning, danger, default
onText:开关中开按钮的文本,默认是 ON
offText:开关中关按钮的文本,默认是 OFF
onInit:初始化组件的事件。
onSwitchChange:开关变化时的事件。
data-on-color/ data-off-color: primary 深蓝, info 浅蓝, success 绿色, warning 黄色, danger 红色
详细介绍:
产品猿社区致力收录更多优质的商业产品,给服务商以及软件采购客户提供更多优质的软件产品,帮助开发者变现来实现多方共赢;
日常运营的过程中我们难免会遇到各种版权纠纷等问题,如果您在社区内发现有您的产品未经您授权而被用户提供下载或使用,您可按照我们投诉流程处理,点我投诉;
本文来自用户发布投稿,不代表产品猿立场 ;若对此文有疑问或内容有严重错误,可联系平台客服反馈;
部分产品是用户投稿,可能本文没有提供官方下下载地址或教程,若您看到的内容没有下载入口,您可以在我们产品园商城搜索看开发者是否有发布商品;若您是开发者,也诚邀您入驻商城平台发布的产品,地址:点我进入;
如若转载,请注明出处:https://www.chanpinyuan.cn/39200.html;