bootstrap switch 按钮开关初始化加载赋值，ajax点击切换

来源：互联网发布：御坂网络编辑：程序博客网时间：2024/05/12 23:42

<link rel="stylesheet" href="/bootstrap-switch.min.css" />

<script type="text/javascript" src="/jquery.js" ></script><script type="text/javascript" src="/bootstrap-switch.min.js" ></script>

最近项目需要用到开关按钮，在网上找了一下，bootstrapswitch用的简单方便。

下载地址： http://www.bootcss.com/p/bootstrap-switch

HTML代码

<div class="col-sm-6 switch" id="mySwitch">    <input id="mySwitchOne" type="checkbox" checked /></div>

初始化加载开关按钮：

if(whiteFlag == "0"){    // 关   $('#mySwitchOne').bootstrapSwitch('state',false,true);}else{关    //     $('#mySwitchOne').bootstrapSwitch('state',true,true);}

// 点击开关切换

$('#mySwitch input').bootstrapSwitch({     onText:'启用',     offText:'停用' ,   onColor:"success",   offColor:"danger",     size:"normal",   onSwitchChange:function(event,state){         if(state==true){       //启用        $.ajax({      type: 'POST',  url: '/user/enableWhitelist',  dataType:'json',  success:function(data){  if(data.success){  }else{  layer.msg(data.errorMessage);  }  },  error:function(XMLHttpRequest,textStatus){      layer.msg(textStatus);      }        })       }else{       //停用        $.ajax({      type: 'POST',  url: '/user/disableWhitelist',  dataType:'json',  success:function(data){  if(data.success){  }else{  layer.msg(data.errorMessage);  }  },  error:function(XMLHttpRequest,textStatus){      layer.msg(textStatus);      }        })   }       }  });

有些地方说的不清楚，请见谅。

阅读全文

0 0