cmgtech
asked on
Javascript Column Highlight not working in IE6
What has to be done to make this work in IE6? Works perfectly in Firefox 3.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<script type="text/javascript">
function init(){
var t = document.getElementById("metrics");
var td = t.rows[3].getElementsByTagName("th");
for( var j=3; j < t.rows.length; ++j)
{
for( var i=0, limit = t.rows[j].cells.length; i < limit; ++i)
{
t.rows[j].cells[i].onclick=highlight;
}
}
}
function highlight(){
var color="#ffff00";
var d = this.parentNode;
for( var i =0; i < d.cells.length; ++i)
if( d.cells[i] === this )
break;
var p = d.parentNode;
for( var k=3; k < p.rows.length; ++k)
{
for( var l=0; l < p.rows[k].cells.length; ++l)
{
if( i != l)
p.rows[k].cells[l].style.backgroundColor='';
else
p.rows[k].cells[l].style.backgroundColor=color;
}
}
this.style.backgroundColor='';
rowFunction(this.parentNode);
}
//r is the current row
function rowFunction(r){
//alert(r.innerHTML);
}
window.onload=init;
</script>
</head>
<body>
<table id="metrics" border=1>
<tr><td colspan="16" class="pageheader">aaa</td></tr>
<tr><td colspan="16">
<table>
<tr><td bgcolor="#00ff00"> </td><td>a</td><tr/>
<tr><td bgcolor="#000000"> </td><td>a</td><tr/>
<tr><td bgcolor="#ff0000"> </td><td>a</td><tr/>
</table>
</td>
</tr>
<tr class="table_header">
<th colspan="3" halign="left" halign="top">a</th>
<th colspan="2" bgcolor="#c3c5a2">a</th>
<th colspan="2" bgcolor="#c3c5a2">a</th>
<th colspan="1" bgcolor="#c3c5a2">a</th>
<th colspan="1" bgcolor="#c3c5a2">a</th>
<th colspan="5" bgcolor="#c3c5a2">a</th>
<th colspan="2">aaa</th>
</tr>
<tr class="table_header">
<th class="metaheader col1">a</th>
<th class="metaheader col2">a</th>
<th class="metaheader col3">a</th>
<th class="metaheader col4">a</th>
<th class="metaheader col5">a</th>
<th class="metaheader col6">a</th>
<th class="mainHeader col7">a</th>
<th class="mainHeader col8">a</th>
<th class="mainHeader col9">a</th>
<th class="mainHeader col10">a</th>
<th class="mainHeader col11">a</th>
<th class="mainHeader col12">a</th>
<th class="mainHeader col13">a</th>
<th class="mainHeader col14">a</th>
<th class="mainHeader col15">a</th>
<th class="mainHeader col16">a</th>
</tr>
<tr bgcolor='#ffffff' class="classname">
<td class="col1">a</td>
<td class="col2">2</td>
<td class="col3">2</td>
<td class="col4">0</td>
<td class="col5">0</td>
<td class="col6">0</td>
<td class="col7" >a</td>
<td class="col8" >a</td>
<td class="col9" >a</td>
<td class="col10" >a</td>
<td class="col11" >a</td>
<td class="col12" >a</td>
<td class="col13" >a</td>
<td class="col14" >a</td>
<td class="col15" >a</td>
<td class="col16" >a</td>
</tr>
<tr bgcolor='#ffffff' class="classname">
<td class="col1">a</td>
<td class="col2">2</td>
<td class="col3">2</td>
<td class="col4">0</td>
<td class="col5">0</td>
<td class="col6">0</td>
<td class="col7" >a</td>
<td class="col8" >a</td>
<td class="col9" >a</td>
<td class="col10" >a</td>
<td class="col11" >a</td>
<td class="col12" >a</td>
<td class="col13" >a</td>
<td class="col14" >a</td>
<td class="col15" >a</td>
<td class="col16" >a</td>
</tr>
<tr bgcolor='#ffffff' class="classname">
<td class="col1">a</td>
<td class="col2">2</td>
<td class="col3">2</td>
<td class="col4">0</td>
<td class="col5">0</td>
<td class="col6">0</td>
<td class="col7" >a</td>
<td class="col8" >a</td>
<td class="col9" >a</td>
<td class="col10" >a</td>
<td class="col11" >a</td>
<td class="col12" >a</td>
<td class="col13" >a</td>
<td class="col14" >a</td>
<td class="col15" >a</td>
<td class="col16" >a</td>
</tr>
<tr bgcolor='#ffffff' class="classname">
<td class="col1">a</td>
<td class="col2">2</td>
<td class="col3">2</td>
<td class="col4">0</td>
<td class="col5">0</td>
<td class="col6">0</td>
<td class="col7" >a</td>
<td class="col8" >a</td>
<td class="col9" >a</td>
<td class="col10" >a</td>
<td class="col11" >a</td>
<td class="col12" >a</td>
<td class="col13" >a</td>
<td class="col14" >a</td>
<td class="col15" >a</td>
<td class="col16" >a</td>
</tr>
</table>
</body>
</html>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
it works... i forgot to deply the application.
thanks for all the help on this.
Mark
thanks for all the help on this.
Mark
you are welcome.
ASKER
https://www.experts-exchange.com/questions/23852300/Trying-to-highlight-an-HTML-column-when-it-is-clicked-want-to-affect-all-cells-in-column-except-the-one-that's-being-clicked.html