bootstrap-switch使用,small、mini设置
1.首先需要引用https://www.bootcss.com/p/bootstrap-switch/。
window.onload=function(){
$('[name="status"]').bootstrapSwitch("size","small");//基本初始化
}
//手动设置按钮状态
$('[name="status"]').bootstrapSwitch('state',false);
//点击按钮切换 switch
$('[name="Btn"]').click(function(){
$('[name="status"]').bootstrapSwitch('toggleState');
});
//点击触发事件,监听按钮状态
$('[name="status"]').on('switchChange.bootstrapSwitch',function(event,state){
//内置对象、内置属性
console.log(event);
//获取状态
console.log(state);
});
属性名称

设置单选框大小,都是无效的。
后来使用js
$('[name="status"]').bootstrapSwitch("size","small");
这种方式设置达成效果。
具体原因还未知,先记录遗留一下吧
bootstrap-switch使用,small、mini设置的更多相关文章
- 前端插件之Bootstrap Switch 选择框开关控制
简介 Bootstrap Switch是一款轻量级插件,可以给选择框设置类似于开关的样式 它是依赖于Bootstrap的一款插件 下载 下载地址 在线引用 导入 因为它是依赖于Bootstrap的一款 ...
- 前端基础(十):Bootstrap Switch 选择框开关控制
简介 Bootstrap Switch是一款轻量级插件,可以给选择框设置类似于开关的样式 它是依赖于Bootstrap的一款插件 下载 下载地址 在线引用 导入 因为它是依赖于Bootstrap的一款 ...
- bootstrap switch功能
bootstrap switch是一个按钮开关,点击时获取其状态可通过以下代码: <input id="email_switch_state" type="chec ...
- bootstrap switch样式修改与多列等间距布局
先以一张图开启今天的随笔 今天实习遇到了switch按钮,小姐姐说用插件bootstrap switch来写,我第一次用这个插件,首先在引入方面就遇到了很多坑,先来总结一下bootstrap swit ...
- bootstrap的popover在trigger设置为hover时不隐藏popover
使用bootstrap的popover,trigger设置为hover时,可以实现当鼠标放置到目标元素上时显示popover,可是无法实现当鼠标移动到popover上时不隐藏popover,在网上找了 ...
- 使用jQuery获取Bootstrap Switch的值
$('#switcher').bootstrapSwitch('state'); // true || false $('#switcher').bootstrapSwitch('toggleStat ...
- bootstrap Switch 的一个坑点
在bootstrap的modal点开的时候改变bootstrapSwitch的状态的时候,会出现第一次打开modal,switch没有变化,第二次以后打开modal才会改变,这个问题找了好久没有找到答 ...
- bootstrap使用总结(carousel设置大小。item设置大小,img设置大小)
在bootstrap中使用carousel,先要给.carousel一个大小, 要想使carousel和item和img随着浏览器大小而变,就要设置 .carousel .item { height: ...
- Bootstrap css背景图片的设置
一. 网页中添加图片的方式有两种 一种是:通过<img>标签直接插入到html中 另一种是:通过css背景属性添加 居中方法:水平居中的text-align:center 和 margin ...
随机推荐
- JMETER 生成测试报告
JMETER测试报告样例 JMETER 提供的生成测试报告功能,能够生成漂亮的HTML测试报告. 上图是测试统计图 20个用户并发,测试时长一分钟,发起流程320次,没有出错,TPS为6.5,平均发起 ...
- ant笔记
目录 ant远程部署 ant的使用,命令! 参考文献: ant+maven一键打包springboot上传服务器发布 判断linux文件.文件夹是否存在 shell中脚本参数传递的两种方式 shell ...
- IDEA中常用的一些设置
一.idea常用设置1.报错级别 idea默认不会像eclipse一样需要ctrl+s进行保存,并且在保存时会进行编译(可以在File>Settings>Build,Executio ...
- @TableName(mybatis-plus中的注解)
@TableName 描述:表名注解 属性 类型 必须指定 默认值 描述 value String 否 "" 表名 schema String 否 "" sch ...
- 02-linux-换源-ui方式
换软件源 使用清华的软件源. Ubuntu 的 ui 界面操作^换源 System setting -> Software & update -> Download from -& ...
- hdu 6217 A BBP Formula 公式题
题意 已知公式:$\pi=\sum_{k=0}^{\infty}\left[\frac{1}{16^{k}}\left(\frac{4}{8 k+1}-\frac{2}{8 k+4}-\frac{1} ...
- java 多态调用
1. 调用成员变量:编译.运行都看左边.2. 调用成员方法:编译看左边,运行看右边. ---------- instanceof 判断某个对象是否属于某种数据类型: boolean b = 对 ...
- Layui Iframe页面间 方法的相互调用
就是普通的iframe之间方法的调用,只是注意一下src就像 var childWindow = $(window.parent.document).find("iframe[src='/A ...
- 1. Spring Cloud Greenwich SR2 概览
Spring Cloud provides tools for developers to quickly build some of the common patterns in distribut ...
- 4.28(TG模拟赛)总结
1.挖地雷 题目背景 NOIp1996提高组第三题 题目描述 在一个地图上有N个地窖(N≤20),每个地窖中埋有一定数量的地雷.同时,给出地窖之间的连接路径.当地窖及其连接的数据给出之后,某人可以从任 ...