复选框与表格问题,谁帮我搞定?[高分]

修改了一下,去掉了对浏览器的兼容性,
希望还可以符合你的要求
在win2000 + ie6.0(或5.0)测试通过

:_)

  1<html>
  2<head>
  3<title>Untitled Document</title>
  4<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
  5</head>
  6<body>
  7<script language="JavaScript">   
  8var checkflag="false";   
  9var theDefaultColor = '#ffffff';   
 10var thePointerColor = '#ccffcc';   
 11var theMarkColor = '#ffcc99';   
 12function check() {   
 13for (var i=0;i<listNews.elements.length;i++) {   
 14var Type=listNews.elements[i].type;   
 15var name=listNews.elements[i].name;   
 16if (Type=="checkbox" && name.indexOf('censor')!=-1) {   
 17  
 18if (listNews.elements[i].checked)   
 19{   
 20newColor = theDefaultColor;   
 21}   
 22else   
 23{   
 24newColor = theMarkColor;   
 25}   
 26var theCells = document.getElementById(i).cells;   
 27var rowCellsCnt = theCells.length;   
 28for (c = 0; c < rowCellsCnt; c++)   
 29{   
 30theCells[c].style.backgroundColor = newColor;   
 31}   
 32  
 33listNews.elements[i].checked=!listNews.elements[i].checked;   
 34}   
 35}   
 36}   
 37  
 38  
 39/**   
 40* Sets/unsets the pointer and marker in browse mode   
 41*   
 42* @param object the table row   
 43* @param interger the row number   
 44* @param string the action calling this script (over, out or click)   
 45* @param string the default background color   
 46* @param string the color to use for mouseover   
 47* @param string the color to use for marking a row   
 48*   
 49* @return boolean whether pointer is set or not   
 50*/   
 51function setPointer(theRow, theRowNum, theAction)   
 52{   
 53  
 54  
 55  
 56  
 57  
 58// 3. Gets the current color...   
 59var theCells = theRow.cells;   
 60var rowCellsCnt = theCells.length;   
 61var currentColor = theCells[0].style.backgroundColor;   
 62var newColor = null;   
 63  
 64// 4. Defines the new color   
 65// 4.1 Current color is the default one   
 66if (currentColor == '' ¦ ¦ currentColor.toLowerCase() == theDefaultColor.toLowerCase())   
 67{   
 68if (theAction == 'over' && thePointerColor != '')   
 69{   
 70newColor = thePointerColor;   
 71}   
 72else if (theAction == 'click' && theMarkColor != '')   
 73{   
 74document.getElementsByTagName("input")[theRowNum].checked =!document.getElementsByTagName("input")[theRowNum].checked;   
 75  
 76newColor = theMarkColor;   
 77}   
 78}   
 79// 4.1.2 Current color is the pointer one   
 80else if (currentColor.toLowerCase() == thePointerColor.toLowerCase() )   
 81{   
 82if (theAction == 'out')   
 83{   
 84newColor = theDefaultColor;   
 85}   
 86else if (theAction == 'click' && theMarkColor != '')   
 87{   
 88document.getElementsByTagName("input")[theRowNum].checked =!document.getElementsByTagName("input")[theRowNum].checked;   
 89  
 90newColor = theMarkColor;   
 91  
 92}   
 93}   
 94// 4.1.3 Current color is the marker one   
 95else if (currentColor.toLowerCase() == theMarkColor.toLowerCase())   
 96{   
 97if (theAction == 'click')   
 98{   
 99document.getElementsByTagName("input")[theRowNum].checked =!document.getElementsByTagName("input")[theRowNum].checked;   
100  
101newColor = (thePointerColor != '') ? thePointerColor : theDefaultColor;   
102}   
103} // end 4   
104  
105// 5. Sets the new color...   
106if (newColor)   
107{   
108var c = null;   
109  
110for (c = 0; c < rowCellsCnt; c++)   
111{   
112theCells[c].style.backgroundColor = newColor;   
113}   
114  
115}   
116  
117return true;   
118} // end of the 'setPointer()' function   
119  
120</script>
121<form action="" method="post" name="listNews">
122<table border="1" cellpadding="0" cellspacing="0" width="760">
123<tr>
124<td align="center" bgcolor="#CCCCCC" height="26" onclick="check()" style="cursor:hand">选择</td>
125<td colspan="2"> </td>
126</tr>
127<tr id="0" onmousedown="setPointer(this, 0, 'click');" onmouseout="setPointer(this, 0, 'out');" onmouseover="setPointer(this, 0, 'over');">
128<td align="center" height="26" width="100"> <input name="censor[0]" onclick="this.checked=!this.checked" type="checkbox" value="0"/></td>
129<td colspan="2"> </td>
130</tr>
131<tr id="1" onmousedown="setPointer(this, 1, 'click');" onmouseout="setPointer(this, 1, 'out');" onmouseover="setPointer(this, 1, 'over');">
132<td align="center" height="26" width="100"> <input name="censor[1]" onclick="this.checked=!this.checked" type="checkbox" value="0"/></td>
133<td colspan="2"> </td>
134</tr>
135<tr id="2" onmousedown="setPointer(this, 2, 'click');" onmouseout="setPointer(this, 2, 'out');" onmouseover="setPointer(this, 2, 'over');">
136<td align="center" height="26" width="100"> <input name="censor[2]" onclick="this.checked=!this.checked" type="checkbox" value="0"/></td>
137<td colspan="2"> </td>
138</tr>
139</table>
140</form>
141</body>
142</html>
Published At
Categories with Web编程
comments powered by Disqus