手机
当前位置:查字典教程网 >网页设计 >脚本HTML教程 >html中的checkbox复选框不确定状态的设置
html中的checkbox复选框不确定状态的设置
摘要:这篇经验要分享的是复选框的不确定状态的,html中的复选框是:一般遇到复选框或许只需要选中或者不选中两种状态即可,但是有时候需要第三种不确定...

 这篇经验要分享的是复选框的不确定状态的,html中的复选框是:

    <input id="cb" type="checkbox"/>

    一般遇到复选框或许只需要选中或者不选中两种状态即可,但是有时候需要第三种不确定状态,例如做带复选框的级联菜单时,子级菜单的多个复选框为部分选中的时,父级菜单的复选框应处于不确定状态,来反映子菜单的部分选中情况。

    方法是通过js设置复选框的indeterminate属性,在标签中设置此属性无效。

    

<html>

<head>

<script>

function init(){

chkbox = document.getElementById("cb");

}

function fun1 () {

    chkbox.indeterminate = false;

    chkbox.checked = true;

}

function fun2() {

    chkbox.indeterminate = false;

    chkbox.checked = false;

}

function fun3() {

    chkbox.indeterminate = true;

}

</script>

</head>

 

<body onload="init()">

  <input id="cb" type="checkbox" />

  <button onclick="fun1()">选中</button>

  <button onclick="fun2()">不选</button>

  <button onclick="fun3()">部分选中</button>

</Body>

</html>

 

 

    另外,复选框的属性checked,在这个标签中只要设置了checked,复选框初始化时都是选中状态,包括不限于一下四种:

checked="true" 

checked="false"

checked=""

checked

    所以,如果要初始显示为不选中的状态,不设置checked属性即可。

【html中的checkbox复选框不确定状态的设置】相关文章:

html中设置让div中的内容超出后自动显示滚动条

html中有亲和力的文字隐藏方法

DIV与SPAN之间有什么区别?

html文档中的 ol 元素的序号数字极限探讨

HTML基本标签有哪些

使用XHTML 1.0 Strict中需要特别注意的地方

HTML表格的表首标记

html中的javascript 全选/取消全选操作示例代码

html中iframe控制父页面刷新实现思路及代码

http响应Last-Modified和ETag以及Apache和Nginx中的配置

精品推荐
分类导航