iCheck】的更多相关文章

一.iCheck:http://www.bootcss.com/p/icheck/ 1.选择一个颜色主题,网上有,有了一个肤色主题,然后就是把这个肤色主题的css文件复制到iCheck文件夹里面 2.引入咯,引入文件 3.html上class引入类,或者name引入 4.然后就是javascript调用,当然要把iCheck.css跟iCheck.js调用起来 5.然后根据已经引入的文件可以来配置iCheck 6. 像下图这样 $('input').iCheck({ checkboxClass:…
特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 — 包括 桌面和移动设备 2.支持触摸设备 — iOS.Android.BlackBerry.Windows Phone等系统 4.方便定制 — 用HTML 和 CSS 即可为其设置样式 (多套皮肤) 5.体积小巧 — gzip压缩后只有1 kb 6.25 种参数 用来定制复选框(checkbox)和单选按钮(radio button) 7.8 个回调事件 用来监听输入框的状态 8.7个方法 用来通过编程方式控制输入框的状态 9.能…
iCheck   特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 - 包括 桌面和移动设备 2.支持触摸设备 - iOS.Android.BlackBerry.Windows Phone等系统 4.方便定制 - 用HTML 和 CSS 即可为其设置样式 (多套皮肤) 5.体积小巧 - gzip压缩后只有1 kb 6.25 种参数 用来定制复选框(checkbox)和单选按钮(radio button) 7.8 个回调事件 用来监听输入框的状态 8.7个方法 用来通过编程方式控制输…
<script type="text/javascript"> $(document).ready(function(){ var callbacks_list = $('.demo-callbacks'); $('.demo-list input').on('ifCreated ifClicked ifChanged ifChecked ifUnchecked ifDisabled ifEnabled ifDestroyed', function(event){ }).i…
checkbox和radio浏览器默认的已经满足不了大众的审美需求,更不用说浏览器之间的差异化,取而代之,优化checkbox和radio的方法也随之诞生了. html结构:单选框为例,简单说明: 其中必需项包括:class="radio" 和 name="名称" <div class="radio" name="sex" value="boy"><ins></ins>&…
遍历所有 checkbox 如果是选中的用 绿色 如果未选中用 灰色 //check控件属性 $('input').each(function() { var self = $(this); var labelText = $(this).attr("data-label"); var thisClass = "icheckbox_line-grey"; if (self.is(':checked')) { thisClass = "icheckbox_l…
官方文档:http://icheck.fronteed.com/ 使用基本样式 $('input').iCheck({ checkboxClass : 'icheckbox_square-blue', radioClass : 'iradio_square-blue', increaseArea: '20%' // optional}); iCheck实现翻页保存状态 //全选与取消全选选完之后将选过的值保存在一个数组里(listRoles) var $cbxSelectAll = $formw…
icheck默认样式比较大,有需求调整checkbox大小. 1. 最简单的方法可用css3来实现,让整个模块层缩放,不兼容低版本浏览器. transform:scale(0.7,0.7)   2. 为了更好的兼容,最好的解决方案: 修改icheck本身默认样式的 width / height 来实现, 虽然宽高改变了,但是背景图片大小依旧,所以多了一步步骤,修改图片大小.完成. .icheckbox_square-blue, .iradio_square-blue { width: 22px;…
这是一个兼容多种浏览器的插件 官网:http://icheck.fronteed.com/ 官方给出了很多的例子,我说一个使用的问题. 使用的时候,要放到window..load的外部. 页面html使用代码:…
废话不多说,直接上图 对,还是上篇文章的图,这次我们不研究datatables,而是看这个复选框,比平常的复选框漂亮太多 看看我是如何实现的吧 插件叫iCheck 用法也简单 引入js和css $("input[type=checkbox]").iCheck({ checkboxClass: "icheckbox_flat-green" }); 可以,这是找到了所有的checkbox 那在看看如何全选 //全选 function check_all() { var…
简介 官方文档:http://www.treejs.cn/v3/api.php zTree 是一个依靠 jQuery 实现的多功能 “树插件”, 而且拥有较好的浏览器兼容性,有着丰富的功能以及可以自定义样式,足以满足大部分业务的开发. 第一步先导入css及js文件 <link href="~/lib/zTree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet" /><script src="~…
jQuery iCheck 插件提供高度可定制的复选框和单选按钮(jQuery和Zepto).最新版本1.0.2,有个最新的2.0预览版,但是发布之后没有再更新. 特点:在不同的浏览器和设备(桌面和移动)一致的输入体验,触摸设备支持(iOS.Android.Windows Phone.黑莓.亚马逊的Kindle),键盘可输入(制表符,空格键,向上或向下键和其他快捷键),屏幕阅读器可以输入(画外音和其他属性,定制的咏叹调)自由(使用任何HTML和CSS样式输入或尝试6视网膜准备皮),体积轻巧(1…
js插件---iCheck是用来做什么的 一.总结 一句话总结:25 种参数 用来定制复选框(checkbox)和单选按钮(radio button) 定制复选框 定制单选按钮 1.iCheck常用的方法有哪些? $('input').iCheck('check');  $('input').iCheck('uncheck');   $('input').iCheck('toggle');   $('input').iCheck('disable');   $('input').iCheck('…
http://www.bootcss.com/p/icheck/ 1.先看下网上下载的demo <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">…
一.全选 在使用jQuery iCheck 插件的时候遇到了一个问题,就是当我们使用普通的js全选功能无效了. $("#checkall").click( function(){ if(this.checked){ $("input[name='checkname']").each(function(){this.checked=true;}); }else{ $("input[name='checkname']").each(function(…
本文转自:http://www.exp99.com/jswz/f2e/1408696007_34.html iCheck   特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 — 包括 桌面和移动设备 2.支持触摸设备 — iOS.Android.BlackBerry.Windows Phone等系统 4.方便定制 — 用HTML 和 CSS 即可为其设置样式 (多套皮肤) 5.体积小巧 — gzip压缩后只有1 kb 6.25 种参数 用来定制复选框(checkbox)和单选按钮…
这篇文章主要介绍了BootStrap iCheck插件全选与获取value值的解决方法,解决方法其实很简单,下面小编给大家分享下这方面的知识 在使用jQuery iCheck 插件的时候遇到了一个问题,就是当我们使用普通的js全选功能无效了. $("#checkall").click( function(){ if(this.checked){ $("input[name='checkname']").each(function(){this.checked=tru…
喜欢bootstrap 风格的同学应该知道,iCheck的样式还是很好看的. 官网: http://www.bootcss.com/p/icheck/ 进入正题,iCheck提供了一些方法,可以进行全选和反选的判定. ifChecked:输入框的状态变为 checked ifUnchecked:checked 状态被移除 ifChanged:输入框的 checked 或 disabled 状态改变了 var checkAll =$('input.all'); //全选的input var che…
iCheck改变 checkbox.radio的样式,原生或用bootstrap的都太丑. 简单用法:引用 <link rel="stylesheet" type="text/css" href="skins/all.css"/> <script src="node_modules/jquery/dist/jquery.js"></script> <script src="i…
1 官网:http://www.bootcss.com/p/icheck/#download 2 博客:https://www.cnblogs.com/xcsn/p/6307610.html https://www.cnblogs.com/xp796/p/5508145.html 3  使用 首先: <div class="form-group" id="polling-radio-wrap"> <label class="col-xs-…
$(this).iCheck('check'); //启用禁用上级编号             $('#OnPar').on('ifUnchecked', function (event) {                 $("#tbParBudCode").prop('disabled', true);                 $("#tbParBudCode").trigger("chosen:updated");        …
1.使用: <link rel="stylesheet" href="css/skins/all.css">或者<link rel="stylesheet" href="css/skins/flat/需要的颜色文件"> <script src="js/jquery.js"></script> <script src="js/icheck.js&…
icheck判断是否选中   1 $("#id").on('ifChanged', function () { 2 if ($(this).is(':checked')) {//就是这么简单 3 //do something 4 } 5 });…
一.什么是icheck 就是用来美化单选框.复选框的. 二.如何使用 1.下载 到 github 下载.https://github.com/fronteed/icheck 下载完毕.解压.目录结构如下: 2.选皮肤 icheck有6种好看的皮肤.分别是极小的.正方形的.平滑的.线形的.北极星.未来.前面四种皮肤又都有10种不同的颜色.分别为黑.红.绿.蓝.青.灰.橘.黄.粉.紫. 我们可以点开demo\index.html文件进行预览.这里面在展现效果的同时也介绍了详细的用法.个人觉得前面三种…
//获取单选和复选框的值//parameters.type:"radio","checkbox"//parameters.name:input-name//parameters.flag:"0"-val,"1"-textfunction getCheckedValue(parameters) { var type = parameters.type; var name = parameters.name; var flag =…
最近要做一个企业的OA系统,以前一直使用EasyUI,一切都好,但感觉有点土了,想换成现在流行的Bootstrap为基础的后台UI风格,想满足的条件应该达到如下几个: 1.美观.大方.简洁 2.兼容IE8.不考虑兼容IE6/IE7,因为现在还有很多公司在使用Win7系统,系统内置了IE8 3.能通过选项卡打开多个页面,不想做单页,iframe也没关系 4.性能好,不要太笨重 5.最好以Bootstrap为基础 6.还希望在以后别的系统中能够复用. 一次次反复纠结的选择开始了,给大家介绍下我考虑过…
网页表单是一个老生常谈的话题.出于这样或那样的目的,一些示例中都会包括用户注册,电子商务结算,用户设置甚至联系人表格.而输入栏是非常容易用现代的CSS3技术来应用样式.但是到底什么决定整体用户体验? 在这篇文章中,我想展示一些免费的开源jQuery插件来帮助开发者创建更简易的web表单.访问者不用太多的犹豫就能完成表单的填写.你也许不想太过华丽页面元素,它会干扰手头的任务.考虑这些附加的特性,它就像一个用户指南,能帮助用户填写表单,而它们又涉及到唯一的或者不熟悉的内容. jQuery Autot…
0 Asp.Net Core 项目实战之权限管理系统(0) 无中生有 1 Asp.Net Core 项目实战之权限管理系统(1) 使用AdminLTE搭建前端 2 Asp.Net Core 项目实战之权限管理系统(2) 功能及实体设计 3 Asp.Net Core 项目实战之权限管理系统(3) 通过EntityFramework Core使用PostgreSQL 4 Asp.Net Core 项目实战之权限管理系统(4) 依赖注入.仓储.服务的多项目分层实现 5 Asp.Net Core 项目实…
0 Asp.Net Core 项目实战之权限管理系统(0) 无中生有 1 Asp.Net Core 项目实战之权限管理系统(1) 使用AdminLTE搭建前端 2 Asp.Net Core 项目实战之权限管理系统(2) 功能及实体设计 3 Asp.Net Core 项目实战之权限管理系统(3) 通过EntityFramework Core使用PostgreSQL 4 Asp.Net Core 项目实战之权限管理系统(4) 依赖注入.仓储.服务的多项目分层实现 5 Asp.Net Core 项目实…
0 Asp.Net Core 项目实战之权限管理系统(0) 无中生有 1 Asp.Net Core 项目实战之权限管理系统(1) 使用AdminLTE搭建前端 2 Asp.Net Core 项目实战之权限管理系统(2) 功能及实体设计 3 Asp.Net Core 项目实战之权限管理系统(3) 通过EntityFramework Core使用PostgreSQL 4 Asp.Net Core 项目实战之权限管理系统(4) 依赖注入.仓储.服务的多项目分层实现 5 Asp.Net Core 项目实…