switchery按钮的使用方法


Posted in Javascript onDecember 18, 2017

1.先引入switchery.css 和 switchery.js

2.绘制 checkbox按钮 : a.静态页面写法  未选中时 <input type="checkbox" class="js-switch_3"  /> switchery按钮的使用方法       选中时  <input type="checkbox" class="js-switch_4" checked /> switchery按钮的使用方法

 

b.C# 写法 (1) @Html.CheckBoxFor(m => m.Active, new { @Class = "js-switch", @checked = Model.Active }) <span> Activate</span>

(2) @Html.CheckBox("edit_forMave_" + i, new { @class = "js-switch", @checked = true })

3. script 中处理,是按钮有点击效果。

当页面中只有一个checkbox 时:var elem = document.querySelector(".js-switch")   var switchery= new Switchery( elem,{color : '#f8ac59'}).

当有多个时:var elem = document.querySelector(".js-switch") 

$.each(funtion (num) { var switchery = new Switchery(this, { color: '#1AB394', className: 'switchery-small' });}) ;

以上这篇switchery按钮的使用方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
给Function做的OOP扩展
May 07 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(一)让静态人物动起来
Jan 23 Javascript
JS+css 图片自动缩放自适应大小
Aug 08 Javascript
jQuery实现的多级下拉菜单效果代码
Aug 24 Javascript
jQuery实现可用于博客的动态滑动菜单完整实例
Sep 17 Javascript
javascript监听页面刷新和页面关闭事件方法详解
Jan 09 Javascript
AngularJS 控制器 controller的详解
Oct 17 Javascript
jQuery ajax读取本地json文件的实例
Oct 31 jQuery
node.js使用redis储存session的方法
Sep 26 Javascript
Vue调用后端java接口的实例代码
Oct 28 Javascript
webpack.DefinePlugin与cross-env区别详解
Feb 23 Javascript
关于uniApp editor微信滑动问题
Jan 15 Javascript
three.js实现3D影院的原理的代码分析
Dec 18 #Javascript
JS函数节流和函数防抖问题分析
Dec 18 #Javascript
vue 将页面公用的头部组件化的方法
Dec 18 #Javascript
浅谈使用React.setState需要注意的三点
Dec 18 #Javascript
vue 项目如何引入微信sdk接口的方法
Dec 18 #Javascript
微信小程序实现给嵌套template模板传递数据的方式总结
Dec 18 #Javascript
微信小程序实现页面跳转传值以及获取值的方法分析
Dec 18 #Javascript
You might like
可快速识别放射性物质-国外大神教你diy一个开放式辐射探测器
2020/03/12 无线电
生成sessionid和随机密码的例子
2006/10/09 PHP
PHPMyAdmin 快速配置方法
2009/05/11 PHP
php中通过虚代理实现延迟加载的实现代码
2011/06/10 PHP
php实现将字符串按照指定距离进行分割的方法
2015/03/14 PHP
php验证身份证号码正确性的函数
2016/07/20 PHP
简单谈谈 php 文件锁
2017/02/19 PHP
js获取浏览器的可视区域尺寸的实现代码
2011/11/30 Javascript
jQuery 自定义函数写法分享
2012/03/30 Javascript
jquery弹出关闭遮罩层实例
2013/08/06 Javascript
Javascript访问器属性实例分析
2014/12/30 Javascript
jquery自定义表格样式
2015/11/23 Javascript
浅谈JavaScript前端开发的MVC结构与MVVM结构
2016/06/03 Javascript
微信小程序 免费SSL证书https、TLS版本问题的解决办法
2016/12/14 Javascript
jQuery实现简易的输入框字数计数功能示例
2017/01/16 Javascript
在vue中使用setInterval的方法示例
2019/04/16 Javascript
[50:22]完美盛典-2018年度红毯走秀
2018/12/16 DOTA
[01:01:52]DOTA2-DPC中国联赛正赛 iG vs LBZS BO3 第一场 3月4日
2021/03/11 DOTA
Python中subprocess的简单使用示例
2015/07/28 Python
浅谈pandas中shift和diff函数关系
2018/04/08 Python
python 随机打乱 图片和对应的标签方法
2018/12/14 Python
使用coverage统计python web项目代码覆盖率的方法详解
2019/08/05 Python
浅谈pytorch 模型 .pt, .pth, .pkl的区别及模型保存方式
2020/05/25 Python
前端制作动画的几种方式(css3,js)
2016/12/12 HTML / CSS
实例讲解使用CSS实现多边框和透明边框的方法
2015/09/08 HTML / CSS
html5画布旋转效果示例
2014/01/27 HTML / CSS
HTML5的hidden属性兼容老浏览器的方法
2014/04/23 HTML / CSS
一套比较完整的软件测试人员面试题
2012/05/13 面试题
软件生产职位结构化面试主要考察要素及面试题库
2015/06/12 面试题
个人简历中的自我评价范例
2013/10/29 职场文书
写给女朋友的道歉信
2014/01/08 职场文书
2015学校年度工作总结
2015/05/11 职场文书
初二物理教学反思
2016/02/19 职场文书
windows11怎么查看自己安装的版本号? win11版本号的查看方法
2021/11/21 数码科技
Android开发手册TextInputLayout样式使用示例
2022/06/10 Java/Android
SpringBoot前端后端分离之Nginx服务器下载安装过程
2022/08/14 Servers