input checkbox属性-Indeterminate状态
我们在使用input标签,多选框时,通常会看到两种状态,即选中(checked)和被选中(unchecked)。
// 选中状态也可写成checked="checked" checked:<input type="checkbox" checked> // 未选中状态不写即可 unchecked:<input type="checkbox" unchecked>
但是对于checkbox还有一种模糊状态,这种状态在哪里会看到呢,如果你用过QQ邮箱的话,相信你会看到,但有可能会忽略这个细节,如QQ邮箱中效果:

那么这种效果是怎么实现的呢。indeterminate既为checkbox中的一个属性必然可以被js控制,所以可以用js来控制现有状态。
<input id="check" type="checkbox">
<script>
var Check = document.getElementById('check');
Check.indeterminate = true;
</script>
出现的效果同QQ邮箱中效果一样,以下为不同浏览器中indeterminate状态显示情况:
IE(10):

firefox:

chrome:

值得注意的是,虽然indeterminate贵为checkbox的属性,但在html中单独使用并不会出现效果。并且indeterminate只会对checkbox的样子发生改变,也就是说与真正的取值并无关系。
input checkbox属性-Indeterminate状态的更多相关文章
- css input checkbox和radio样式美化
参考:https://segmentfault.com/a/1190000004553258 http://www.haorooms.com/post/css_mh_ck_radio 思路都一样的,先 ...
- 利用checkbox自带属性indeterminate构建含部分选中状态的树状结构
本来上个月就像发的,但是一直忙啊忙的也没时间整理,所以拖到了现在. 好吧上面这句就是废话,我就是感概下.下面是正文. 前段时间在弄一个轻量级的web项目,要构建一个树状结构目录,同时希望能把部分选中的 ...
- checkbox属性checked="checked"但状态不是勾选状态的解决办法
原因: jQuery API明确说明,1.6+的jQuery要用prop,不能用attr否则无效,尤其是checkBox的checked的属性的判断.
- jquery--获取input checkbox是否被选中以及渲染checkbox选中状态
jquery获取checkbox是否被选中 html <div><input type="checkbox" id="is_delete" n ...
- jQuery判断复选框checkbox的选中状态
通过jQuery设置复选框为选中状态 复选框 <input type="checkbox"/> 错误代码: $("input").attr(&quo ...
- jquery 获取 checkbox 的 checked 状态问题
这个郁闷了,今天写这个功能的时候发现了问题,上网找了好多资料对照,更加纠结... 事实证明一切,自己测试了N遍,发现网上的说法和自己以前的理解都是错的,不知道大家有没发现. 下面来看看网上大多资料的说 ...
- HTML中强大的input标签属性
用了许久的html,<input>这个标签是最常用的标签之一. <input type="">标签中type属性是必不可少的,以往我最常用的有 type=& ...
- Jquery获取checkbox属性checked为undefined
说明:本文来自新浪博客,因为无法收藏,故直接copy过来备注,以后好查询 原网址:http://blog.sina.com.cn/s/blog_6810dfc20101jddq.html 使用jQue ...
- Ztree _ 横向显示子节点、点击文字勾选、去除指定元素input的勾选状态
前些天项目需要树结构表现数据,需求ztree就能满足所以直接使用ztree只是踩了些小坑... 1.ztree子节点横向显示(下图): 效果说明:第三级子节点按需求横向显示其他竖向显示,每行最多显示5 ...
随机推荐
- 安装KB3132372补丁后,WIN10中IE内核加载flash崩溃
今天(2015年12月30日)突然很多人反馈在WIN10上IE内核的PC端应用崩溃.经过一番查找,最终定位到问题.WIN10今天发布了新的补丁KB3132372,64位系统更新该补丁后,打开IE内核的 ...
- ServiceStack.Redis订阅发布服务的调用
1.Redis订阅发布介绍 Redis订阅发布是一种消息通信模式:发布者(publisher)发送消息,订阅者(Subscriber)接受消息.类似于设计模式中的观察者模式. 发布者和订阅者之间使用频 ...
- Xtrabackup 安装使用
一 简介: Xtrabackup是一个对InnoDB做数据备份的工具,支持在线热备份(备份时不影响数据读写),是商业备份工具InnoDB Hotbackup的一个很好的替代品.它能对Inno ...
- [转]odoo常用openerp-server.conf配置参数详解
参数 说明 用法 addons_path addons模块的查找路径,多个路径用逗号分隔 addons_path = E:\GreenOdoo8.0\source\openerp\addons csv ...
- (转)EClipse插件推荐
http://www.importnew.com/4707.html 来自非营利性Eclipse基金会的Eclipse IDE以其插件生态系统著称.Eclipse市场拥有海量插件可供下载,你可以通过插 ...
- jetty 内嵌服务
pom.xml <properties> <project.build.sourceEncoding>UTF-8</project.build.sourceEncodin ...
- hadoop2的思想架构
mapreduce 2 思想架构 mr2解决了mr1的jobTracker的单点颈瓶问题,这个问题会影响hadoop的扩展性,集群的可靠性,mr1中jobTracker负责集群作业的分发,管理,调度, ...
- 使用MyBatis Generator自动创建代码( SSM框架)
步骤: 1.找到该文件目录 (上图文件下载地址:http://download.csdn.net/download/u014617413/9668872) 2.修改generatorConfig.xm ...
- C# 显示问题
- ubuntu 16.04 设置位wifi热点 方法(手机可链接)亲测可用
Ubuntu16.04里面可以直接创建热点,而不用像以前的版本,还要其他辅助工具. 具体步骤如下: 1. 点击有上角网络标志,点开编辑链接. 2. 选择 WiFi ,添加一个网络. 3.设置这个网络 ...