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);
随机推荐
- js 前台ajax验证马克一下
function check_form(){ var email=$("#email").val(); var code=$("#code").val(); v ...
- linux 安装unrar
Centos 6 32位下安装 wget http://pkgs.repoforge.org/unrar/unrar-4.2.3-1.el6.rf.i686.rpmrpm -ivh unrar-4.2 ...
- Eclipse下建立简单JNI程序实现返回double类型
在Eclipse下生成时要注意,由于通常是在package里面添加类,而非像单独建立工程时独立添加,所以,在编译的时候,都需要进入包所在的文件夹, javac 包名.类名 这样的形式来编译,同理,ja ...
- python递归列出目录及其子目录下所有文件
python递归列出目录及其子目录下所有文件 一.前言 函数的递归,简单来说,就是函数内部调用自己 先举个小例子,求阶乘 def factorial(n): if n == 0: return 1 e ...
- TypeScript 教程&手册
参考:https://www.w3cschool.cn/typescript/ https://www.gitbook.com/book/zhongsp/typescript-handbook/det ...
- vs添加静态链接库+添加动态链接库+添加头文件目录
头文件添加方法:工程---属性---配置属性---c/c++---常规---附加包含目录(Additional Include Directories):加上头文件存放目录.注意:(1)路径必须指向头 ...
- jquery二维码生成插件jquery.qrcode.js
插件描述:jquery.qrcode.js 是一个能够在客户端生成矩阵二维码QRCode 的jquery插件 ,使用它可以很方便的在页面上生成二维条码. 转载于:http://www.jq22.com ...
- (http请求+cookie)的交互流程
如果步骤5携带的是过期的cookie或者是错误的cookie,那么将认证失败,返回至要求身份认证页面. 当前 Cookie 有两个版本:Version 0 和 Version 1.通过它们有两种设置响 ...
- 使用vue遇到坑
1.请求ajax方式一定要在Vue methods或creads里去请求. 方便做下拉刷新数据 . 2.多看看vue源码. 3.多写tab常项,h5下拉滚动,pc分页效果,回到顶部,提高熟悉vue需求 ...
- 硬链接、软链接和inode
一.inode 在Linux中,“一切皆文件”. 唯一标识文件的是inode而非文件名,文件名仅是为了方便人们的记忆和使用,系统或程序通过 inode 寻找正确的文件数据块. 什么是数据块呢?文件储存 ...