萬盛學電腦網 >> 網頁制作 >> 腳本Html教程 >> html中的checkbox復選框不確定狀態的設置
html中的checkbox復選框不確定狀態的設置
這篇經驗要分享的是復選框的不確定狀態的，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屬性即可。
- 上一頁:XHTML表單標簽
- 下一頁:HTML表格標記水平對齊屬性ALIGN
