功能截圖
也實現了功能,當用戶的單選框全選時,全選的checkbox也會被選上,你所想的功能完全被實現。
直接上代碼(具體更改部分見代碼)
window.onload = function() {
var allbtn = document.getElementById("selectall");//這兒的selectall表示全選checkbox的id
allbtn.onclick = function() {
if(allbtn.checked) {
var allchooses = document.getElementsByName("select");//這兒的select表示單選的checkbox的name
for(var i = 0; i < allchooses.length; i++) {
allchooses[i].checked = true;
}
} else {
var allchooses = document.getElementsByName("select");//這兒的select表示單選的checkbox的name
for(var i = 0; i < allchooses.length; i++) {
allchooses[i].checked = false;
}
}
}
var singlebtn = document.getElementsByName("select");//這兒的select表示單選的checkbox的name
var n ;
for(n= 0; n < singlebtn.length; n++) {
singlebtn[n].onclick = function() {
if(this.checked) {
for(var m=0;m<singlebtn.length;m++){
if(!singlebtn[m].checked){
break;
}
else if(m==singlebtn.length-1){
allbtn.checked=true;
}
}
} else {
for(var m=0;m<singlebtn.length;m++){
if(singlebtn[m].checked){
break;
}
}
allbtn.checked=false;
}
}
}
}