单个按钮可以参照这个链接https://blog.csdn.net/u012233776/article/details/53305846

多个按钮时,

html中其中想操作这个按钮开启与关闭

<div class="form-group">    <label class="col-sm-3 control-label">付费用户2</label>    <div class="col-sm-8">        <input type="checkbox" name="ss" value="1" class="js-switch test" />    </div></div><!--<div class="hr-line-dashed"></div>-->

js

/**
* 切换Switchery开关函数 switchElement Switchery对象,checkedBool 选中的状态
*/
function setSwitchery(switchElement, checkedBool) {
if((checkedBool && !switchElement.isChecked()) || (!checkedBool && switchElement.isChecked())) {
switchElement.setPosition(true);
switchElement.handleOnchange(true);
}
} // 切换按钮初始化
var switchery = [];
var elems = document.querySelectorAll('.js-switch');
for (var i = 0; i < elems.length; i++) {
switchery[i] = new Switchery(elems[i]);
}

现在就需要获取需要切换的dom的index

var js_switch_index = $('.js-switch').index($('.js-switch.test'));
setSwitchery(switchery[js_switch_index], true);//开启
setSwitchery(switchery[js_switch_index], false);//关闭

最新文章

  1. ActiveMQ消息队列的使用及应用
  2. 【数学】Jersey Politics
  3. [bzoj3694]最短路
  4. iOS真机调试
  5. UICollectionView基础
  6. 好用的ASP.NET 分页类 简单好用 支持 AJAX 自定义文字
  7. RabbitMQ 原文译02--工作队列
  8. ANDROID_MARS学习笔记_S04_004_用HTTPCLENT发带参数的get和post请求
  9. 转:单片机C语言中的data,idata,xdata,pdata,code
  10. Memcached和Redis异同
  11. hdu1540-Tunnel Warfare (线段树区间合并)
  12. 杭电oj1062 Text Reverse
  13. CSS3学习之——【特殊属性】
  14. C#设计模式整理
  15. vue 导航栏切换
  16. 2017年3月28日15:59:16 终于明白spring这套鬼东西是怎么玩的了
  17. CSS hack 360浏览器 极速模式与兼容模式
  18. PythonStudy——字符串扩展方法 String extension method
  19. laravel数据库配置
  20. ubuntu14.04 解析不了域名—ubuntu的DNS配置

热门文章

  1. 快速理解VLAN与三层交换机
  2. 手把手和你一起实现一个Web框架实战——EzWeb框架(四)[Go语言笔记]Go项目实战
  3. JVM钩子函数的使用
  4. SQL注入之MySQL报错注入整理
  5. NOIP 模拟 $11\;\rm math$
  6. 解决springboot在mac电脑下启动过慢的问题
  7. 【权限管理】Apache Shiro和Spring Security的对比
  8. CrackMe-CrackHead
  9. JDBC中的元数据
  10. BeanUtils中的自动类型转换(二)