bootstrapSwitch 使用
1、bootstrapSwitch 默认选项,加上checked表示true,不加表示false
<input type="checkbox" id="" name="status" checked data-size="small" value="1">
2、swich配置
$('[name="status"]').bootstrapSwitch({
onText: "上架",
offText: "下架",
onColor: "danger",
offColor: "info",
size: "small",
onSwitchChange: function (event, state) {
if (state == true) {
$(this).val("1");
} else {
$(this).val("2");
}
}
})
3、触发swich事件。
$('[name="status"]').on('switchChange.bootstrapSwitch', function (event, state) {
if (state == true) {
$.get("/gift/updatestatus", {
id: $(this).attr("id"),
status: '0'
}, function (data) {
console.log(data.result);
location.reload() })
} else {
$.get("/gift/updatestatus", {
id: $(this).attr("id"),
status: '1'
}, function (data) {
console.log(data.result);
location.reload() }) }
});
bootstrapSwitch 使用的更多相关文章
- 动态设置bootstrapswitch状态
checkbox的html <input type="checkbox" name="mySwitch" id="mySwitch"& ...
- datatables隐藏列与createdRow渲染bootstrapSwitch形成的BUG
背景: 昨天写了一个页面用于规则库的增删改查. 数据使用datatables渲染,后端返回数据由前端进行一次性渲染和分页. 隐藏列: 排序的ID不展示,但是排序又想按照ID来排,所以把ID单独作为一列 ...
- bootstrap-switch 使用
网址:http://www.bootcss.com/p/bootstrap-switch/ 界面设置不调用方法没成功,事件也不起作用不知道是jquery版本原因还是什么原因!,下面亲测试可以使用 $( ...
- AngularJS+bootstrap-switch 实现开关控件
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- tips:解决bootstrap-switch 在jqgrid中动态加载不显示的问题
bootstrapo-switch 是一个十分好用的插件,用来关闭开启再好不过了,适合状态类型只有两种的情况下可以进行切换 在使用中,在jqgrid动态加载的时候出现不能加载的问题 原因是html代码 ...
- bootstrap 多选款样式:bootstrap-switch
有时候,为了美化checkbox后者radio的时候,让用户体验起来更好,jquery里有icheck. bootstrap里有bootstrap-switch,就简单介绍下bootstrap-swi ...
- bootstrap-switch与angularjs结合使用
bootstrap-switch和angularjs结合使用 由于angularjs的dom操作总是先执行,导致$(input[name="switch"])找不到元素,所以使用d ...
- bootstrap-switch
首先需要引入bootstrap的css和js文件,再引入bootstrap-switch.css和bootstrap-switch.js文件 <script type="text/ja ...
- 改变bootstrapSwitch按钮状态
$('.switch-state').bootstrapSwitch('state',true);
随机推荐
- static变量的作用
在C语言中,关键字static的意思是静态的,有3个明显的作用: 1. 在函数体内,静态变量具有记忆作用,即一个被声明为静态的变量在这一函数被调用的过程中其值维持不变. 2. 在模块内(但在函数体外) ...
- Java Collections Framework Java集合框架概览
Java SE documents -- The Collections Framework http://docs.oracle.com/javase/8/docs/technotes/guides ...
- TF卡.购买(20180925)
1.准备买 2个 一个 用于 老的手机"红米Note",一个用于现在我的手机"红米Note4X". 之前,这2个手机都是用的 那个坏掉的64g的tf卡 2.刚问 ...
- 两种以太网 RDMA 协议: iWARP 和 RoCE
本文是讲演 How Ethernet RDMA Protocols iWARP and RoCE Support NVMe over Fabrics[1]的摘要. 如果 NVMe 存储系统与主机是分离 ...
- Oracle的导出和导入
(摘自:http://www.cnblogs.com/mchina/archive/2012/09/12/2678093.html) 数据库的备份操作是在整个项目运行中最重要的工作之一. 一.数据的导 ...
- 条款2:尽量以const enum inline 来替换 #define
这里说的意思其实相当于,宁可以用编译器来替换预处理器 因为使用预处理器可能使得被处理过的东西无法进入符号表,例如 #define MAXLEN 16 这里的MAXLEN并没有进入符号表,这样有编译错误 ...
- react table dropdown
<DropdownButton type="primary" trigger={['click']} onClick={() => this.detail(item)} ...
- 理解 HTTP2.0
链接 HTTP/2 头部压缩技术介绍 我们知道,HTTP/2 协议由两个 RFC 组成: 一个是 RFC 7540,描述了 HTTP/2 协议本身:一个是 RFC 7541,描述了 HTTP/2 协议 ...
- Android系统代码查询命令集合
Android系统代码查询命令集合 *#06# 显示MEID *#*#4636#*#* 显示版本,或更新相机韧体 *#*#7594#*#* 当长按关机按钮时,会出现一个切换手机部分设置及更改设定 WL ...
- 最新海康摄像机、NVR、流媒体服务器、回放取流RTSP地址规则说明
本文档主要介绍海康威视设备预览.回放.流媒体取流的RTSP URL和IE直接预览.回放的HTTP URL. RTSP为取流协议,取到码流后需要解码显示,可以通过VLC播放器进行测试,IE等浏览器网页不 ...