<body onload=check()>
<h3>三态的checkbox(变化顺序:未选中->灰色选中->白色选中)</h3><br>
<form name=test>
根据onclick变化的checkbox:<br>
<input type=checkbox name=checkbox0 flag=0 >初始化为未选中的checkbox<br>
</td><td><input type=checkbox name=checkbox1 flag=1 >初始化为白色选中的checkbox<br>
</td><td><input type=checkbox name=checkbox2 flag=2 >初始化为灰色选中的checkbox<br>
根据onpropertychange变化的checkbox:<br>
<input type=checkbox name=checkbox3 onpropertychange="gray2(this)">初始化为未选中的checkbox
</form>
</body>
<script language=javascript>
//用于onclick,需要一个自定义属性flag.
function gray(c)
{
switch(c.flag)
{
//当flag为0时,为未选中状态
case "0":c.checked=true;c.indeterminate=true;c.flag="2";break;
//当flag未1时,为白色选中状态
case "2":c.checked=true;c.indeterminate=false;c.flag="1";break;
//当flag为2时,为灰色选中状态
case "1":c.checked=false;c.indeterminate=false;c.flag="0";break;
}
}
//用于onpropertychange
function gray2(c)
{
c.indeterminate=c.checked;
}
//用于body的onload,根据checkbox的flag属性判断checkbox的状态
function check()
{
for(var i = 0;i<document.test.elements.length;i++)
{
var ele = document.test.elements[i];
if(ele.flag!=null)
{
if(ele.flag=="0")
{
ele.checked = false;
ele.indeterminate = false;
}
if(ele.flag=="1")
{
ele.checked = true;
ele.indeterminate = false;
}
if(ele.flag=="2")
{
ele.checked = true;
ele.indeterminate = true;
}
}
}
}
</script>
三态的checkbox
时间: 2024-09-16 05:57:00
三态的checkbox的相关文章
三态选择树实现终结者
示例代码运行效果图如下: 在很多情况下,我们经常需要实现树的多态选择,如上图所示,当全部子节点选中的情况下,当前节点才被选中(如图示[荆门市]节点),当子节点部分选中时,当前节点处于第三态(如图示[湖北省]节点)当全部子节点未选中时,当前节点处于未选中的状态(如图示[江苏省]节点).本文就介绍这种三态选择树的具体实现方法. 在VC知识库第十九期中河南科技大学丛雷朋友也介绍了一种实现方法,两种方法比较,本文介绍的方法实现简单,兼容原CTreeCtrl的全部操作,CheckBox也是采用控件本身的C
WPF自定义控件与样式(4)-CheckBox/RadioButton自定义样式
原文:WPF自定义控件与样式(4)-CheckBox/RadioButton自定义样式 一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: CheckBox复选框的自定义样式,有两种不同的风格实现: RadioButton单选框自定义样式,有两种不同的风格实现: 二. CheckBox自定义样式 2.1 CheckBox基本样式 标准CheckBox样式代
asp.net winform TreeView节点中的CheckBox 禁用实例
发现TreeNode没有相关属性,TreeView中的CheckBox也基本没法控制,于是上网求救,基本上都在说废话,有些大侠竟然连WinForm和WebForm都分不清. 有人说把节点字体颜色设置成灰色,然后: 代码如下 复制代码 private void myTreeView1_BeforeCheck(object sender, TreeViewCancelEventArgs e) { if(e.Node.ForeColor==
extjs4.2 三态树
问题描述 js比较菜,请问下哪位大神写过extjs4.2的三态树给个源码,或者给个思路,貌似extjs3.x是通过重写Ext.ux.TreeCheckNodeUI控件,那时4貌似没有这个类啊. 解决方案 Extjs4在Ext.tree.Panel中对带有checkbox的树的节点的选择上和extjs3不一样,主要是在tree上添加checkchange事件left_tree.on('checkchange',function(node, checked){checkboxSelected(nod
checkbox-asp.net中关于CheckBox知识问答
问题描述 asp.net中关于CheckBox知识问答 asp.net 中把中的值传入数据库的后台代码
IE下双击checkbox反应延迟问题的解决方法
这篇文章主要介绍了IE下双击checkbox反应延迟问题的解决方法,需要的朋友可以参考下 代码如下: <span style="font-size:18px;"><input type='checkbox'/></span> 上面这段代码在IE下会生成一个多选框,单击它会选中打勾,再次单击则会取消打勾. 这样看上去并没有什么不妥的地方,但是如果你尝试快速两次单击(比双击稍微慢一点吧..)这个按钮,可能效果并不如你想象的那样. 在
前端的小玩意(4)自定义checkbox或者radio的外观
原理: 通过隐藏原有的(调透明度和绝对定位),然后用一个新的图标来覆盖上去 CSS代码: .radio { /*这个描述的是输入框的基本样式,透明,绝对定位,浮动在最下*/ opacity: 0; position: absolute; z-index: -1; /*这行是让原图标被其他的遮挡,避免挡住其他按钮影响事件触发*/ <span style="font-family: Arial, Helvetica, sans-serif;">/* </span>o
Javasript的checkbox的一个问题
问题 JavaScript的checkbox框架可以如下使用: <FORM NAME="list" METHOD="post"><INPUT name=no TYPE=checkbox><INPUT name=no TYPE=checkbox><INPUT name=no TYPE=checkbox></FORM> 在js中:for(var i=0;i<document.list.no.length;
同名checkbox的分级操作
<html><head><title>this is a test!</title></head><body><h1>This is a Test!</h1><form action="" name = "test"><input name="checkboxfather1" type="checkbox" >