关于checkbox选择的问题

yami251139 2008-08-01 06:38:05
只要一个静态页面就可以了
一个table，里面全部都是checkbox
第一列和第一行选择后同列和同行能够做到全选择
当然，当中由一个去掉勾之后，第一列和第一行相应的勾要去掉
那个全选也是，最好有代码，没有也给个思路

不再table中我已经能够做到了
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 

<html> 

<head> 

<title>Test.html</title> 

<script type="text/javascript"> 

function cball() { 

for(var i=1;i<=6;i++) { 

if (f1.allcheckbox.checked) 

f1.children['m'+i].checked=true; 

else 

f1.children['m'+i].checked=false; 

} 

} 

function odd() { 

var numOfChecked = 0; 

for (var i=1;i<=6;i++) { 

if (f1.children['m'+i].checked) 

numOfChecked++; 

} 

if(numOfChecked==6) 

f1.allcheckbox.checked=true; 

else 

f1.allcheckbox.checked=false; 

} 

</script> 

</head> 



<body> 

<td>

<form name="f1" id="f1"> 

<input name="allcheckbox" type="checkbox" title='全选/取消' onclick="cball()">全选<br/> 

<input name="m1" type="checkbox" onclick='odd()'>M1<br/> 

<input name="m2" type="checkbox" onclick='odd()'>M2<br/> 

<input name="m3" type="checkbox" onclick='odd()'>M3<br/> 

<input name="m4" type="checkbox" onclick='odd()'>M4<br/> 

<input name="m5" type="checkbox" onclick='odd()'>M5<br/> 

<input name="m6" type="checkbox" onclick='odd()'>M6<br/> 

</td>



</form> 

</body> 

</html>

这个是可以的
但是放到table中就不行了。。。他说我children里面的对象没有找到。。。

<html>

<head>

<title>interview</title>

<script type="text/javascript"> 

function checkall() { 

for(var i=1;i<=4;i++) { 

if (f1.allcheckbox1.checked) 

f1.children['m'+i].checked=true; 

else 

f1.children['m'+i].checked=false; 

} 

} 

function odd() { 

var numOfChecked = 0; 

for (var i=1;i<=4;i++) { 

if (f1.children['m'+i].checked) 

numOfChecked++; 

} 

if(numOfChecked==4) 

f1.allcheckbox1.checked=true; 

else 

f1.allcheckbox1.checked=false; 

} 

</script> 

</head>

<body>

<form name = "f1" id = "f1">

<table border = "1">

	<tr> 

		<th>全选<input type = "checkbox" ></th>

		<th>1月<input type = "checkbox" name ="allcheckbox1" onclick = "checkall()"></th>

		<th>2月<input type = "checkbox" name ="allcheckbox2"></th>

		<th>3月<input type = "checkbox" name ="allcheckbox3"></th>

        <th>4月<input type = "checkbox" name ="allcheckbox4"></th>

        <th>5月<input type = "checkbox" name ="allcheckbox5"></th>

        <th>6月<input type = "checkbox" name ="allcheckbox6"></th>

	</tr>

	<tr>

		<td>2008年</td>

		<td>1000<input type = "checkbox" name ="m1" onclick = "odd()"></td>

		<td>2000</td>

		<td>3000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

	</tr>

	<tr>

		<td>2007年</td>

		<td>4000<input type = "checkbox" name ="m2" onclick = "odd()"></td>

		<td>5000</td>

		<td>6000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

	</tr>

        <tr>

		<td>2006年</td>

		<td>7000<input type = "checkbox" name ="m3" onclick = "odd()"></td>

		<td>8000</td>

		<td>9000</td>

        <td>3000</td>

        <td>3000</td>           

        <td>3000</td>

	</tr>

	<tr>

		<td>2005年</td>

		<td>7000<input type = "checkbox" name ="m4" onclick = "odd()"></td>

		<td>8000</td>

		<td>9000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

	</tr>

</table>

</form> 

<input type = "button" value = "提交" onclick = "submit()"/>



</body>

</html>
...全文
171 18 打赏 收藏 转发到动态 举报
写回复
用AI写文章
18 条回复
切换为时间正序
请发表友善的回复…
发表回复
sagezk 2008-08-01
  • 打赏
  • 举报
 回复 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>SageZk - SagaTable</title>

<script type="text/javascript">

//<![CDATA[

var m;



function searchNodes(oRoot, sTagName, fCallBack) {

	if (!oRoot.hasChildNodes()) return;

	var cns = oRoot.childNodes;

	for (var i = 0; i < cns.length; ++i) {

		if (cns[i].nodeType == 1 &&

		    cns[i].nodeName == sTagName) fCallBack(cns[i]);

		searchNodes(cns[i], sTagName, fCallBack);

	}

};



function dealclick() {

	this.parentNode.parentNode.style.backgroundColor = this.checked ? "#CCCCCC" : "#FFFFFF";

	var r, c;

	outer: for (var y = 0; y < m.length; ++y) {

		for (var x = 0; x < m[y].length; ++x) {

			if (m[y][x] == this) {

				r = y;

				c = x;

				break outer;

			}

		}

	}

	if (r == 0 && c == 0) {

		for (var y = 0; y < m.length; ++y) {

			for (var x = 0; x < m[y].length; ++x) {

				m[y][x].checked = this.checked;

				m[y][x].parentNode.parentNode.style.backgroundColor = this.checked ? "#CCCCCC" : "#FFFFFF";

			}

		}	

	} else if (r == 0) {

		for (var y = 1; y < m.length; ++y) {

			m[y][c].checked = this.checked;

			m[y][c].parentNode.parentNode.style.backgroundColor = this.checked ? "#CCCCCC" : "#FFFFFF";

		}

	} else if (c == 0) {

		for (var x = 1; x < m[0].length; ++x) {

			m[r][x].checked = this.checked;

			m[r][x].parentNode.parentNode.style.backgroundColor = this.checked ? "#CCCCCC" : "#FFFFFF";

		}

	} else {

		//

	}

}



window.onload = function() {

	m = new Array();

	var frm = document.getElementById("f1");

	searchNodes(frm, "TR",

		function(tr) {

			var cbs = new Array();

			var tds = tr.childNodes;

			for (var i = 0; i < tds.length; ++i) {

				if (tds[i].nodeType != 1) continue;

				var txt = document.createTextNode(tds[i].innerHTML);

				var chk = document.createElement("input");

				chk.setAttribute("type", "checkbox");

				chk.onclick = dealclick;

				var lbl = document.createElement("label");

				lbl.appendChild(txt);

				lbl.appendChild(chk);

				cbs.push(chk);

				tds[i].replaceChild(lbl, tds[i].firstChild);

			}

			m.push(cbs);

		}

	);

};

//]]>

</script>

</head>



<body>

<form id="f1">

<table border="1">

    <tr> 

        <th>全选</th>

        <th>1月</th>

        <th>2月</th>

        <th>3月</th>

        <th>4月</th>

        <th>5月</th>

        <th>6月</th>

    </tr>

    <tr>

        <th>2008年</th>

        <td>1000</td>

        <td>2000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

    </tr>

    <tr>

        <th>2007年</th>

        <td>4000</td>

        <td>5000</td>

        <td>6000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

    </tr>

    <tr>

        <th>2006年</th>

        <td>7000</td>

        <td>8000</td>

        <td>9000</td>

        <td>3000</td>

        <td>3000</td>           

        <td>3000</td>

    </tr>

    <tr>

        <th>2005年</th>

        <td>7000</td>

        <td>8000</td>

        <td>9000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

    </tr>

</table>

</form> 

</body>

</html>
sagezk 2008-08-01
  • 打赏
  • 举报
 回复 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>SageZk - SagaTable</title>

<script type="text/javascript">

//<![CDATA[

var m;



function searchNodes(oRoot, sTagName, fCallBack) {

	if (!oRoot.hasChildNodes()) return;

	var cns = oRoot.childNodes;

	for (var i = 0; i < cns.length; ++i) {

		if (cns[i].nodeType == 1 &&

		    cns[i].nodeName == sTagName) fCallBack(cns[i]);

		searchNodes(cns[i], sTagName, fCallBack);

	}

};



function dealclick() {

	this.parentNode.parentNode.style.backgroundColor = this.checked ? "#CCCCCC" : "#FFFFFF";

	var r, c;

	outer: for (var y = 0; y < m.length; ++y) {

		for (var x = 0; x < m[y].length; ++x) {

			if (m[y][x] == this) {

				r = y;

				c = x;

				break outer;

			}

		}

	}

	if (r == 0 && c == 0) {

		for (var y = 0; y < m.length; ++y) {

			for (var x = 0; x < m[y].length; ++x) {

				m[y][x].checked = this.checked;

				m[y][x].parentNode.parentNode.style.backgroundColor = this.checked ? "#CCCCCC" : "#FFFFFF";

			}

		}	

	} else if (r == 0) {

		for (var y = 1; y < m.length; ++y) {

			m[y][c].checked = this.checked;

			m[y][c].parentNode.parentNode.style.backgroundColor = this.checked ? "#CCCCCC" : "#FFFFFF";

		}

	} else if (c == 0) {

		for (var x = 1; x < m[0].length; ++x) {

			m[r][x].checked = this.checked;

			m[r][x].parentNode.parentNode.style.backgroundColor = this.checked ? "#CCCCCC" : "#FFFFFF";

		}

	} else {

		//

	}

}



window.onload = function() {

	m = new Array();

	var frm = document.getElementById("f1");

	searchNodes(frm, "TR",

		function(tr) {

			var cbs = new Array();

			var tds = tr.childNodes;

			for (var i = 0; i < tds.length; ++i) {

				if (tds[i].nodeType != 1) continue;

				var txt = document.createTextNode(tds[i].innerHTML);

				var chk = document.createElement("input");

				chk.setAttribute("type", "checkbox");

				chk.onclick = dealclick;

				var lbl = document.createElement("label");

				lbl.appendChild(txt);

				lbl.appendChild(chk);

				cbs.push(chk);

				tds[i].replaceChild(lbl, tds[i].firstChild);

			}

			m.push(cbs);

		}

	);

};

//]]>

</script>

</head>



<body>

<form id="f1">

<table border="1">

    <tr> 

        <th>全选</th>

        <th>1月</th>

        <th>2月</th>

        <th>3月</th>

        <th>4月</th>

        <th>5月</th>

        <th>6月</th>

    </tr>

    <tr>

        <th>2008年</th>

        <td>1000</td>

        <td>2000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

    </tr>

    <tr>

        <th>2007年</th>

        <td>4000</td>

        <td>5000</td>

        <td>6000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

    </tr>

    <tr>

        <th>2006年</th>

        <td>7000</td>

        <td>8000</td>

        <td>9000</td>

        <td>3000</td>

        <td>3000</td>           

        <td>3000</td>

    </tr>

    <tr>

        <th>2005年</th>

        <td>7000</td>

        <td>8000</td>

        <td>9000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

    </tr>

</table>

</form> 

</body>

</html>
yami251139 2008-08-01
  • 打赏
  • 举报
 回复
俄。。。想起来了。。。明天结吧。。。
yami251139 2008-08-01
  • 打赏
  • 举报
 回复
问题解决了
koko和a老大每人90，竹子20
结贴了
awusoft 2008-08-01
  • 打赏
  • 举报
 回复 




<html>

<head>

<title>interview</title>

<script type="text/javascript"> 



var y = new Array();

   y=["2008","2007","2006","2005"];

   var m = new Array();

   m=["01","02","03","04","05","06"];

function selectAll(obj)

{

	

   for(var i=0;i<y.length;i++)

   {

       for(var j=0;j<m.length;j++)

		{

			document.getElementById("m"+y[i]+m[j]).checked=obj.checked;

		}

   }

}



function aa(obj,y)

{

   for(var i=0;i<m.length;i++)

   {

       document.getElementById("m"+y+m[i]).checked=obj.checked;

   }

}



function bb(obj,m)

{

   for(var i=0;i<y.length;i++)

   {

	document.getElementById("m"+y[i]+m).checked=obj.checked;

   }

   

}



function getValue()

{

	var tmpe="";

	var value="";

	for(var i=0;i<y.length;i++)

   {

      temp = y[i]+"年 ";

       for(var j=0;j<m.length;j++)

		{

		var obj = document.getElementById("m"+y[i]+m[j]);

			if(obj.checked)

			{

				temp = temp+m[j]+"月"+obj.value+";";

			}

		}

		value = value+temp+"||"+"\n";//用来显示的话就加"\n"

		// value = value+temp+"||";//不显示就不要用"\n"

   }

   alert(value);

   document.f1.action =  document.f1.action+"?value="+value;

   return true;

}

</script> 

</head>

<body>

<form name = "f1" id = "f1" onsubmit="return getValue();" action="t.html">

<table border = "1">

    <tr> 

        <th>全选<input type = "checkbox" onclick = "selectAll(this);"></th>

        <th>1月<input type = "checkbox" name ="allcheckbox1" onclick = "bb(this,'01');"></th>

        <th>2月<input type = "checkbox" name ="allcheckbox2" onclick="bb(this,'02');"></th>

        <th>3月<input type = "checkbox" name ="allcheckbox3" onclick="bb(this,'03');"></th>

        <th>4月<input type = "checkbox" name ="allcheckbox4" onclick="bb(this,'04');"></th>

        <th>5月<input type = "checkbox" name ="allcheckbox5" onclick="bb(this,'05');"></th>

        <th>6月<input type = "checkbox" name ="allcheckbox6" onclick="bb(this,'06');"></th>

    </tr>

    <tr>

        <td>2008年<input type = "checkbox" name ="y2008" onclick = "aa(this,'2008');"></td>

        <td>1000<input type = "checkbox" name ="m200801" value="1000"></td>

        <td>2000<input type = "checkbox" name ="m200802" value="2000"></td>

        <td>3000<input type = "checkbox" name ="m200803" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200804" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200805" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200806" value="3000"></td>

    </tr>

    <tr>

        <td>2007年<input type = "checkbox" name ="y2007" onclick = "aa(this,'2007');"></td>

        <td>4000<input type = "checkbox" name ="m200701" value="3000"></td>

        <td>5000<input type = "checkbox" name ="m200702" value="3000"></td>

        <td>6000<input type = "checkbox" name ="m200703" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200704" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200705" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200706" value="3000"></td>

    </tr>

        <tr>

        <td>2006年<input type = "checkbox" name ="y2006" onclick = "aa(this,'2006');"></td>

        <td>7000<input type = "checkbox" name ="m200601" value="3000"></td>

        <td>8000<input type = "checkbox" name ="m200602" value="3000"></td>

        <td>9000<input type = "checkbox" name ="m200603" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200604" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200605" value="3000"></td>           

        <td>3000<input type = "checkbox" name ="m200606" value="3000"></td>

    </tr>

    <tr>

        <td>2005年<input type = "checkbox" name ="y2005" onclick = "aa(this,'2005');"></td>

        <td>7000<input type = "checkbox" name ="m200501" value="3000"></td>

        <td>8000<input type = "checkbox" name ="m200502" value="3000"></td>

        <td>9000<input type = "checkbox" name ="m200503" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200504" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200505" value="3000"></td>

        <td>3000<input type = "checkbox" name ="m200506" value="3000"></td>

    </tr>

</table>

<input type = "submit" value = "提交"/>

</form> 





</body>

</html>
kokobox 2008-08-01
  • 打赏
  • 举报
 回复
加上了提交，代码如下：



<html>

<head>

<title>interview</title>

<script type="text/javascript"> 

function checkall(v) {

	if(v.name=='h'){

		var o = document.getElementsByName("a");

		if(v.checked){

			for(var i=0 ; i<o.length ; i++){

				var id = o[i].id+v.id;

				

				document.getElementById(id).checked=true; 

			}

		}else{

			for(var i=0 ; i<o.length ; i++){

				var id = o[i].id+v.id;

				

				document.getElementById(id).checked=false; 

			}

		}

	}else{

		for(var i=1;i<=4;i++) {

			var id = v.id+i;

			

			if (v.checked){

				document.getElementById(id).checked=true; 

			}else{ 

				document.getElementById(id).checked=false; 

			}

		} 

	}

} 



function doAll(v){

	var o = document.getElementsByName("a");

	var oh = document.getElementsByName("h");

	if(v.checked){

		for(var i = 0 ; i < o.length; i++){

			if(!o[i].checked){

				o[i].checked=true;

				checkall(o[i]);

			}

		}

		for(var t = 0 ; t < oh.length; t++){

			if(!oh[t].checked){

				oh[t].checked=true;

			}

		}

	}else{

		for(var i = 0 ; i < o.length; i++){

			if(o[i].checked){

				o[i].checked=false;

				checkall(o[i]);

			}

		}

		for(var t = 0 ; t < oh.length; t++){

			if(oh[t].checked){

				oh[t].checked=false;

			}

		}

	}

}

function odd(v) { 

} 



function onSub(){

	var o = document.getElementsByTagName("INPUT");

	var url = "/yami.do?&checkbox=";

	for(var i=0; i<o.length; i++){

		if(o[i].type=="checkbox"&&o[i].checked&&o[i].value!=''&&i!=o.length-1){

			url = url + o[i].value + "&checkbox=";

		}else{

			url = url + o[i].value ;

		}

	}



	alert(url);



}

</script> 

</head>

<body>

<form name = "f1" id = "f1">

<table border = "1">

    <tr> 

        <th>全选<input type = "checkbox" name="all" onclick="doAll(this)" ></th>

        <th>1月<input type = "checkbox" name ="a" id="m" onclick = "checkall(this)"></th>

        <th>2月<input type = "checkbox" name ="a" id="d" onclick = "checkall(this)"></th>

        <th>3月<input type = "checkbox" name ="a" id="e" onclick = "checkall(this)"></th>

       

        <th>4月<input type = "checkbox" name ="a" id="g" onclick = "checkall(this)"></th>

        <th>5月<input type = "checkbox" name ="a" id="k" onclick = "checkall(this)"></th>

    </tr>

    <tr>

        <td>2008年<input type = "checkbox" name ="h" id="1" onclick = "checkall(this)"></td>

        <td>1000<input type = "checkbox" name ="m1" value="m1" onclick = "odd()"></td>

        <td>2000<input type = "checkbox" name ="d1" value="d1" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="e1" value="e1" onclick = "odd()"></td>

       

        <td>3000<input type = "checkbox" name ="g1" value="g1" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="k1" value="k1" onclick = "odd()"></td>

    </tr>

    <tr>

        <td>2007年<input type = "checkbox" name ="h" id="2" onclick = "checkall(this)"></td>

        <td>4000<input type = "checkbox" name ="m2" value="m2" onclick = "odd()"></td>

        <td>5000<input type = "checkbox" name ="d2" value="d2" onclick = "odd()"></td>

        <td>6000<input type = "checkbox" name ="e2" value="e2" onclick = "odd()"></td>

        

        <td>3000<input type = "checkbox" name ="g2" value="g2" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="k2" value="k2" onclick = "odd()"></td>

    </tr>

        <tr>

        <td>2006年<input type = "checkbox" name ="h" id="3" onclick = "checkall(this)"></td>

        <td>7000<input type = "checkbox" name ="m3" value="m3" onclick = "odd()"></td>

        <td>8000<input type = "checkbox" name ="d3" value="d3" onclick = "odd()"></td>

        <td>9000<input type = "checkbox" name ="e3" value="e3" onclick = "odd()"></td>

       

        <td>3000<input type = "checkbox" name ="g3" value="g3" onclick = "odd()"></td>           

        <td>3000<input type = "checkbox" name ="k3" value="k3" onclick = "odd()"></td>

    </tr>

    <tr>

        <td>2005年<input type = "checkbox" name ="h" id="4" onclick = "checkall(this)"></td>

        <td>7000<input type = "checkbox" name ="m4" value="m4" onclick = "odd()"></td>

        <td>8000<input type = "checkbox" name ="d4" value="d4" onclick = "odd()"></td>

        <td>9000<input type = "checkbox" name ="e4" value="e4" onclick = "odd()"></td>

       

        <td>3000<input type = "checkbox" name ="g4" value="g4" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="k4" value="k4" onclick = "odd()"></td>

    </tr>

</table>

</form> 

<input type = "button" value = "提交" onclick = "onSub()"/>



</body>

</html>
awusoft 2008-08-01
  • 打赏
  • 举报
 回复 


<html>

<head>

<title>interview</title>

<script type="text/javascript"> 

function selectAll(obj)

{

	var y = new Array();

   y=["2008","2007","2006","2005"];

   var m = new Array();

   m=["01","02","03","04","05","06"];

   for(var i=0;i<y.length;i++)

   {

       for(var j=0;j<m.length;j++)

		{

			document.getElementById("m"+y[i]+m[j]).checked=obj.checked;

		}

   }

}



function aa(obj,y)

{

   for(var i=1;i<7;i++)

   {

       document.getElementById("m"+y+"0"+i).checked=obj.checked;

   }

}



function bb(obj,m)

{

   var y = new Array();

   y=["2008","2007","2006","2005"];

   for(var i=0;i<y.length;i++)

   {

	document.getElementById("m"+y[i]+m).checked=obj.checked;

   }

   

}

</script> 

</head>

<body>

<form name = "f1" id = "f1">

<table border = "1">

    <tr> 

        <th>全选<input type = "checkbox" onclick = "selectAll(this);"></th>

        <th>1月<input type = "checkbox" name ="allcheckbox1" onclick = "bb(this,'01');"></th>

        <th>2月<input type = "checkbox" name ="allcheckbox2" onclick="bb(this,'02');"></th>

        <th>3月<input type = "checkbox" name ="allcheckbox3" onclick="bb(this,'03');"></th>

        <th>4月<input type = "checkbox" name ="allcheckbox4" onclick="bb(this,'04');"></th>

        <th>5月<input type = "checkbox" name ="allcheckbox5" onclick="bb(this,'05');"></th>

        <th>6月<input type = "checkbox" name ="allcheckbox6" onclick="bb(this,'06');"></th>

    </tr>

    <tr>

        <td>2008年<input type = "checkbox" name ="y2008" onclick = "aa(this,'2008');"></td>

        <td>1000<input type = "checkbox" name ="m200801" ></td>

        <td>2000<input type = "checkbox" name ="m200802" ></td>

        <td>3000<input type = "checkbox" name ="m200803" ></td>

        <td>3000<input type = "checkbox" name ="m200804" ></td>

        <td>3000<input type = "checkbox" name ="m200805" ></td>

        <td>3000<input type = "checkbox" name ="m200806" ></td>

    </tr>

    <tr>

        <td>2007年<input type = "checkbox" name ="y2007" onclick = "aa(this,'2007');"></td>

        <td>4000<input type = "checkbox" name ="m200701" ></td>

        <td>5000<input type = "checkbox" name ="m200702" </td>

        <td>6000<input type = "checkbox" name ="m200703" </td>

        <td>3000<input type = "checkbox" name ="m200704" </td>

        <td>3000<input type = "checkbox" name ="m200705" </td>

        <td>3000<input type = "checkbox" name ="m200706" </td>

    </tr>

        <tr>

        <td>2006年<input type = "checkbox" name ="y2006" onclick = "aa(this,'2006');"></td>

        <td>7000<input type = "checkbox" name ="m200601" ></td>

        <td>8000<input type = "checkbox" name ="m200602" </td>

        <td>9000<input type = "checkbox" name ="m200603" </td>

        <td>3000<input type = "checkbox" name ="m200604" </td>

        <td>3000<input type = "checkbox" name ="m200605" </td>           

        <td>3000<input type = "checkbox" name ="m200606" </td>

    </tr>

    <tr>

        <td>2005年<input type = "checkbox" name ="y2005" onclick = "aa(this,'2005');"></td>

        <td>7000<input type = "checkbox" name ="m200501" ></td>

        <td>8000<input type = "checkbox" name ="m200502" ></td>

        <td>9000<input type = "checkbox" name ="m200503" ></td>

        <td>3000<input type = "checkbox" name ="m200504" ></td>

        <td>3000<input type = "checkbox" name ="m200505" ></td>

        <td>3000<input type = "checkbox" name ="m200506" ></td>

    </tr>

</table>

</form> 

<input type = "button" value = "提交" onclick = "submit()"/>



</body>

</html>
kokobox 2008-08-01
  • 打赏
  • 举报
 回复
这回好了，你看下吧，代码：



<html>

<head>

<title>interview</title>

<script type="text/javascript"> 

function checkall(v) {

	if(v.name=='h'){

		var o = document.getElementsByName("a");

		if(v.checked){

			for(var i=0 ; i<o.length ; i++){

				var id = o[i].id+v.id;

				

				document.getElementById(id).checked=true; 

			}

		}else{

			for(var i=0 ; i<o.length ; i++){

				var id = o[i].id+v.id;

				

				document.getElementById(id).checked=false; 

			}

		}

	}else{

		for(var i=1;i<=4;i++) {

			var id = v.id+i;

			

			if (v.checked){

				document.getElementById(id).checked=true; 

			}else{ 

				document.getElementById(id).checked=false; 

			}

		} 

	}

} 



function doAll(v){

	var o = document.getElementsByName("a");

	var oh = document.getElementsByName("h");

	if(v.checked){

		for(var i = 0 ; i < o.length; i++){

			if(!o[i].checked){

				o[i].checked=true;

				checkall(o[i]);

			}

		}

		for(var t = 0 ; t < oh.length; t++){

			if(!oh[t].checked){

				oh[t].checked=true;

			}

		}

	}else{

		for(var i = 0 ; i < o.length; i++){

			if(o[i].checked){

				o[i].checked=false;

				checkall(o[i]);

			}

		}

		for(var t = 0 ; t < oh.length; t++){

			if(oh[t].checked){

				oh[t].checked=false;

			}

		}

	}

}

function odd(v) { 

} 

</script> 

</head>

<body>

<form name = "f1" id = "f1">

<table border = "1">

    <tr> 

        <th>全选<input type = "checkbox" name="all" onclick="doAll(this)" ></th>

        <th>1月<input type = "checkbox" name ="a" id="m" onclick = "checkall(this)"></th>

        <th>2月<input type = "checkbox" name ="a" id="d" onclick = "checkall(this)"></th>

        <th>3月<input type = "checkbox" name ="a" id="e" onclick = "checkall(this)"></th>

       

        <th>4月<input type = "checkbox" name ="a" id="g" onclick = "checkall(this)"></th>

        <th>5月<input type = "checkbox" name ="a" id="k" onclick = "checkall(this)"></th>

    </tr>

    <tr>

        <td>2008年<input type = "checkbox" name ="h" id="1" onclick = "checkall(this)"></td>

        <td>1000<input type = "checkbox" name ="m1" onclick = "odd()"></td>

        <td>2000<input type = "checkbox" name ="d1" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="e1" onclick = "odd()"></td>

       

        <td>3000<input type = "checkbox" name ="g1" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="k1" onclick = "odd()"></td>

    </tr>

    <tr>

        <td>2007年<input type = "checkbox" name ="h" id="2" onclick = "checkall(this)"></td>

        <td>4000<input type = "checkbox" name ="m2" onclick = "odd()"></td>

        <td>5000<input type = "checkbox" name ="d2" onclick = "odd()"></td>

        <td>6000<input type = "checkbox" name ="e2" onclick = "odd()"></td>

        

        <td>3000<input type = "checkbox" name ="g2" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="k2" onclick = "odd()"></td>

    </tr>

        <tr>

        <td>2006年<input type = "checkbox" name ="h" id="3" onclick = "checkall(this)"></td>

        <td>7000<input type = "checkbox" name ="m3" onclick = "odd()"></td>

        <td>8000<input type = "checkbox" name ="d3" onclick = "odd()"></td>

        <td>9000<input type = "checkbox" name ="e3" onclick = "odd()"></td>

       

        <td>3000<input type = "checkbox" name ="g3" onclick = "odd()"></td>           

        <td>3000<input type = "checkbox" name ="k3" onclick = "odd()"></td>

    </tr>

    <tr>

        <td>2005年<input type = "checkbox" name ="h" id="4" onclick = "checkall(this)"></td>

        <td>7000<input type = "checkbox" name ="m4" onclick = "odd()"></td>

        <td>8000<input type = "checkbox" name ="d4" onclick = "odd()"></td>

        <td>9000<input type = "checkbox" name ="e4" onclick = "odd()"></td>

       

        <td>3000<input type = "checkbox" name ="g4" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="k4" onclick = "odd()"></td>

    </tr>

</table>

</form> 

<input type = "button" value = "提交" onclick = "submit()"/>



</body>

</html>
kokobox 2008-08-01
  • 打赏
  • 举报
 回复
横向纵向都可以了，代码贴给你：



<html>

<head>

<title>interview</title>

<script type="text/javascript"> 

function checkall(v) { 

	for(var i=1;i<=4;i++) {

		var id = v.id+i;

		

		if (v.checked){

			document.getElementById(id).checked=true; 

		}else{ 

			document.getElementById(id).checked=false; 

		}

	} 

} 



function doAll(v){

	var o = document.getElementsByName("a");

	if(v.checked){

		for(var i = 0 ; i < o.length; i++){

			if(!o[i].checked){

				o[i].checked=true;

				checkall(o[i]);

			}

		}

	}else{

		for(var i = 0 ; i < o.length; i++){

			if(o[i].checked){

				o[i].checked=false;

				checkall(o[i]);

			}

		}

	}

}



function odd(v) { 

/*

	var numOfChecked = 0; 

	for (var i=1;i<=4;i++) { 

		if (f1.children['m'+i].checked) 

			numOfChecked++; 

		} 

		if(numOfChecked==4){

			f1.allcheckbox1.checked=true; 

		}else{ 

			f1.allcheckbox1.checked=false; 

		}

		*/

} 





</script> 

</head>

<body>

<form name = "f1" id = "f1">

<table border = "1">

    <tr> 

        <th>全选<input type = "checkbox" name="all" onclick="doAll(this)" ></th>

        <th>1月<input type = "checkbox" name ="a" id="m" onclick = "checkall(this)"></th>

        <th>2月<input type = "checkbox" name ="a" id="d" onclick = "checkall(this)"></th>

        <th>3月<input type = "checkbox" name ="a" id="e" onclick = "checkall(this)"></th>

       

        <th>4月<input type = "checkbox" name ="a" id="g" onclick = "checkall(this)"></th>

        <th>5月<input type = "checkbox" name ="a" id="k" onclick = "checkall(this)"></th>

    </tr>

    <tr>

        <td>2008年</td>

        <td>1000<input type = "checkbox" name ="m1" onclick = "odd()"></td>

        <td>2000<input type = "checkbox" name ="d1" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="e1" onclick = "odd()"></td>

       

        <td>3000<input type = "checkbox" name ="g1" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="k1" onclick = "odd()"></td>

    </tr>

    <tr>

        <td>2007年</td>

        <td>4000<input type = "checkbox" name ="m2" onclick = "odd()"></td>

        <td>5000<input type = "checkbox" name ="d2" onclick = "odd()"></td>

        <td>6000<input type = "checkbox" name ="e2" onclick = "odd()"></td>

        

        <td>3000<input type = "checkbox" name ="g2" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="k2" onclick = "odd()"></td>

    </tr>

        <tr>

        <td>2006年</td>

        <td>7000<input type = "checkbox" name ="m3" onclick = "odd()"></td>

        <td>8000<input type = "checkbox" name ="d3" onclick = "odd()"></td>

        <td>9000<input type = "checkbox" name ="e3" onclick = "odd()"></td>

       

        <td>3000<input type = "checkbox" name ="g3" onclick = "odd()"></td>           

        <td>3000<input type = "checkbox" name ="k3" onclick = "odd()"></td>

    </tr>

    <tr>

        <td>2005年</td>

        <td>7000<input type = "checkbox" name ="m4" onclick = "odd()"></td>

        <td>8000<input type = "checkbox" name ="d4" onclick = "odd()"></td>

        <td>9000<input type = "checkbox" name ="e4" onclick = "odd()"></td>

       

        <td>3000<input type = "checkbox" name ="g4" onclick = "odd()"></td>

        <td>3000<input type = "checkbox" name ="k4" onclick = "odd()"></td>

    </tr>

</table>

</form> 

<input type = "button" value = "提交" onclick = "submit()"/>



</body>

</html>
yami251139 2008-08-01
  • 打赏
  • 举报
 回复 
<html>

<head>

<title>interview</title>

<script type="text/javascript"> 

function checkall1() {

		for ( var i = 1; i <= 4; i++) {

			if (f1.allcheckbox1.checked)

				eval('f1.m' + i).checked = true;

			else

				eval('f1.m' + i).checked = false;

		}

	}

function odd1(){ 

        var numOfChecked1 = 0; 

        for (var i=1;i<=4;i++) { 

            if (eval('f1.m' + i).checked) 

                numOfChecked1++; 

        } 

        if(numOfChecked1==4) 

            f1.allcheckbox1.checked=true; 

        else 

            f1.allcheckbox1.checked=false; 

        } 





function checkall2() {

		for ( var i = 1; i <= 4; i++) {

			if (f1.allcheckbox2.checked)

				eval('f1.n' + i).checked = true;

			else

				eval('f1.n' + i).checked = false;

		}

	}

function odd2() { 

        var numOfChecked2 = 0; 

        for (var i=1;i<=4;i++) { 

            if (eval('f1.n' + i).checked) 

                numOfChecked2++; 

        } 

        if(numOfChecked2==4) 

            f1.allcheckbox2.checked=true; 

        else 

            f1.allcheckbox2.checked=false; 

        } 





function checkall3() {

		for ( var i = 1; i <= 4; i++) {

			if (f1.allcheckbox3.checked)

				eval('f1.a' + i).checked = true;

			else

				eval('f1.a' + i).checked = false;

		}

	}

function odd3(){ 

        var numOfChecked3 = 0; 

        for (var i=1;i<=4;i++) { 

            if (eval('f1.a' + i).checked) 

                numOfChecked3++; 

        } 

        if(numOfChecked3==4) 

            f1.allcheckbox3.checked=true; 

        else 

            f1.allcheckbox3.checked=false; 

        } 





function checkall4() {

		for ( var i = 1; i <= 4; i++) {

			if (f1.allcheckbox4.checked)

				eval('f1.b' + i).checked = true;

			else

				eval('f1.b' + i).checked = false;

		}

	}

function odd4() { 

        var numOfChecked4 = 0; 

        for (var i=1;i<=4;i++) { 

            if (eval('f1.b' + i).checked) 

                numOfChecked4++; 

        } 

        if(numOfChecked4==4) 

            f1.allcheckbox4.checked=true; 

        else 

            f1.allcheckbox4.checked=false; 

        } 





function checkall5() {

		for ( var i = 1; i <= 4; i++) {

			if (f1.allcheckbox5.checked)

				eval('f1.c' + i).checked = true;

			else

				eval('f1.c' + i).checked = false;

		}

	}

function odd5(){ 

        var numOfChecked5 = 0; 

        for (var i=1;i<=4;i++) { 

            if (eval('f1.c' + i).checked) 

                numOfChecked5++; 

        } 

        if(numOfChecked5==4) 

            f1.allcheckbox5.checked=true; 

        else 

            f1.allcheckbox5.checked=false; 

        } 





function checkall6() {

		for ( var i = 1; i <= 4; i++) {

			if (f1.allcheckbox6.checked)

				eval('f1.d' + i).checked = true;

			else

				eval('f1.d' + i).checked = false;

		}

	}

function odd6() { 

        var numOfChecked6 = 0; 

        for (var i=1;i<=4;i++) { 

            if (eval('f1.d' + i).checked) 

                numOfChecked6++; 

        } 

        if(numOfChecked6==4) 

            f1.allcheckbox6.checked=true; 

        else 

            f1.allcheckbox6.checked=false; 

        } 













</script> 

</head>

<body>

<form name = "f1" id = "f1">

<table border = "1">

	<tr> 

		<th>全选<input type = "checkbox" name = "allcheckbox" onclick = "checkall()"></th>

		<th>1月<input type = "checkbox" name ="allcheckbox1" onclick = "checkall1()"></th>

		<th>2月<input type = "checkbox" name ="allcheckbox2" onclick = "checkall2()"></th>

		<th>3月<input type = "checkbox" name ="allcheckbox3" onclick = "checkall3()"></th>

        <th>4月<input type = "checkbox" name ="allcheckbox4" onclick = "checkall4()"></th>

        <th>5月<input type = "checkbox" name ="allcheckbox5" onclick = "checkall5()"></th>

        <th>6月<input type = "checkbox" name ="allcheckbox6" onclick = "checkall6()"></th>

	</tr>

	<tr>

		<td>2008年<input type = "checkbox" name ="allcheckbox7" onclick = "checkall7()"></td>

		<td>1000<input type = "checkbox" name ="m1" onclick = "odd1()"></td>

		<td>2000<input type = "checkbox" name ="n1" onclick = "odd2()"></td>

		<td>3000<input type = "checkbox" name ="a1" onclick = "odd3()"></td>

        <td>3000<input type = "checkbox" name ="b1" onclick = "odd4()"></td>

        <td>3000<input type = "checkbox" name ="c1" onclick = "odd5()"></td>

        <td>3000<input type = "checkbox" name ="d1" onclick = "odd6()"></td>

	</tr>

	<tr>

		<td>2007年<input type = "checkbox" name ="allcheckbox8" onclick = "checkall8()"></td>

		<td>4000<input type = "checkbox" name ="m2" onclick = "odd1()"></td>

		<td>5000<input type = "checkbox" name ="n2" onclick = "odd2()"></td>

		<td>6000<input type = "checkbox" name ="a2" onclick = "odd3()"></td>

        <td>3000<input type = "checkbox" name ="b2" onclick = "odd4()"></td>

        <td>3000<input type = "checkbox" name ="c2" onclick = "odd5()"></td>

        <td>3000<input type = "checkbox" name ="d2" onclick = "odd6()"></td>

	</tr>

        <tr>

		<td>2006年<input type = "checkbox" name ="allcheckbox9" onclick = "checkall9()"></td>

		<td>7000<input type = "checkbox" name ="m3" onclick = "odd1()"></td>

		<td>8000<input type = "checkbox" name ="n3" onclick = "odd2()"></td>

		<td>9000<input type = "checkbox" name ="a3" onclick = "odd3()"></td>

        <td>3000<input type = "checkbox" name ="b3" onclick = "odd4()"></td>

        <td>3000<input type = "checkbox" name ="c3" onclick = "odd5()"></td>           

        <td>3000<input type = "checkbox" name ="d3" onclick = "odd6()"></td>

	</tr>

	<tr>

		<td>2005年<input type = "checkbox" name ="allcheckbox10" onclick = "checkall10()"></td>

		<td>7000<input type = "checkbox" name ="m4" onclick = "odd1()"></td>

		<td>8000<input type = "checkbox" name ="n4" onclick = "odd2()"></td>

		<td>9000<input type = "checkbox" name ="a4" onclick = "odd3()"></td>

        <td>3000<input type = "checkbox" name ="b4" onclick = "odd4()"></td>

        <td>3000<input type = "checkbox" name ="c4" onclick = "odd5()"></td>

        <td>3000<input type = "checkbox" name ="d4" onclick = "odd6()"></td>

	</tr>

</table>

</form> 

<input type = "button" value = "提交" onclick = "submit()"/>



</body>

</html>

竖的已经搞定了
就是横的和全选那个，有点没思路。。。。
要求和竖的一样。。。
kokobox 2008-08-01
  • 打赏
  • 举报
 回复
哦，没注意，我再改一下
yami251139 2008-08-01
  • 打赏
  • 举报
 回复
[Quote=引用楼主 yami251139 的帖子:]
只要一个静态页面就可以了
一个table，里面全部都是checkbox
第一列和第一行选择后同列和同行能够做到全选择
当然，当中由一个去掉勾之后，第一列和第一行相应的勾要去掉
那个全选也是，最好有代码，没有也给个思路

不再table中我已经能够做到了

JScript code<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test.html</title>
<script type="text/javascript">…
[/Quote]
还有横选。。。
kokobox 2008-08-01
  • 打赏
  • 举报
 回复
原来竹子也看到了，早知道我先去吃饭好了，o(∩_∩)o...哈哈

回聊
kokobox 2008-08-01
  • 打赏
  • 举报
 回复
已经给你改好，代码如下：



<html>

<head>

<title>interview</title>

<script type="text/javascript"> 

function checkall() { 



for(var i=1;i<=4;i++) {

var id = "m"+i;

if (document.getElementById("allcheckbox1").checked){

    document.getElementById(id).checked=true; 

}else{ 

document.getElementById(id).checked=false; }

} 

} 

function odd() { 

var numOfChecked = 0; 

for (var i=1;i<=4;i++) { 

if (f1.children['m'+i].checked) 

numOfChecked++; 

} 

if(numOfChecked==4) 

f1.allcheckbox1.checked=true; 

else 

f1.allcheckbox1.checked=false; 

} 

</script> 

</head>

<body>

<form name = "f1" id = "f1">

<table border = "1">

    <tr> 

        <th>全选<input type = "checkbox" ></th>

        <th>1月<input type = "checkbox" name ="allcheckbox1" id="allcheckbox1" onclick = "checkall()"></th>

        <th>2月<input type = "checkbox" name ="allcheckbox2" ></th>

        <th>3月<input type = "checkbox" name ="allcheckbox3" ></th>

        <th>4月<input type = "checkbox" name ="allcheckbox4" ></th>

        <th>5月<input type = "checkbox" name ="allcheckbox5" ></th>

        <th>6月<input type = "checkbox" name ="allcheckbox6" ></th>

    </tr>

    <tr>

        <td>2008年</td>

        <td>1000<input type = "checkbox" name ="m1" onclick = "odd()"></td>

        <td>2000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

    </tr>

    <tr>

        <td>2007年</td>

        <td>4000<input type = "checkbox" name ="m2" onclick = "odd()"></td>

        <td>5000</td>

        <td>6000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

    </tr>

        <tr>

        <td>2006年</td>

        <td>7000<input type = "checkbox" name ="m3" onclick = "odd()"></td>

        <td>8000</td>

        <td>9000</td>

        <td>3000</td>

        <td>3000</td>           

        <td>3000</td>

    </tr>

    <tr>

        <td>2005年</td>

        <td>7000<input type = "checkbox" name ="m4" onclick = "odd()"></td>

        <td>8000</td>

        <td>9000</td>

        <td>3000</td>

        <td>3000</td>

        <td>3000</td>

    </tr>

</table>

</form> 

<input type = "button" value = "提交" onclick = "submit()"/>



</body>

</html>



如果还有什么问题，再联系，我先去吃饭o(∩_∩)o...
老紫竹 2008-08-01
  • 打赏
  • 举报
 回复
或者用标准的
getElementById("m"+i);
记得把input 的id 属性加上，不要只有name属性
老紫竹 2008-08-01
  • 打赏
  • 举报
 回复
eval('f1.m' + i).checked = true;
你用这样的方式看看，别用什么childre 了。
这个等同于
f1.m1.checked
呵呵
yami251139 2008-08-01
  • 打赏
  • 举报
 回复
是不是因为tr的缘故？？？
ListView中添加CheckBox
2、选择其中的checkbox，当滚动ListView的时候，会出现一些Checkbox选择错位的现象， 原因：为记住Checkbox的选择状态 解决方案：当选择Checkbox的时候，记下其状态，然后在getView方法中进行设置
关于checkbox传值问题
最近不知道要写什么了，没有怎么学习新的知识点，而是一直在研究jquery相关的东西，有人说jquery已经快要...今天写了一个简单的功能，将checkbox选中的value值提交到后端。 <!DOCTYPE html> <html> &...
layui 关于checkbox 无法发选中的问题
使用layui进行快速开发时有时会遇到点击checkbox控件后再次点击的问题，在说明问题之前确保你有正确的引入layui的脚本文件以及脚本控件中的form控件。 checkbox、select、radio控件依赖于layui的form模块，没有引入...
jQuery操作checkbox选择
禁止星期： @Html.CheckBoxList("weekdays", true) @Html.ValidationMessageFor(m => m.checkWeekdays) ===============
vue中关于checkbox的问题
在vue中写checkbox时，发现出现问题：当点击一个选项时，输出的数组为空，当取消或者点击下一个选项时，才会出现该选项值且下一个选项值不会出现
Web 开发

81,094

社区成员

341,711

社区内容

发帖
与我相关
我的任务
社区描述
Java Web 开发
社区管理员
  • Web 开发社区
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章