Вот упрощенная версия проблемы, с которой я сейчас сталкиваюсь на работе.Код работает так, как должен в Firefox 3.6.При щелчке по строке Javascript меняет имя своего класса, и свойства дочерних элементов также должны меняться.
В IE6 и, возможно, в других версиях, он работает только для TD "title1" и "title2": они меняют цвет.Что не работает, так это то, что «value1» и «value2» меняются с дисплея: ни на одно значение по умолчанию.Я пытался работать с атрибутом style.display TD безрезультатно.
Любая помощь будет принята с благодарностью.
<!doctype html>
<html>
<head>
<style type="text/css">
table#input{
width: 100%;
border-collapse: collapse;
}
table#input tr{
border-bottom: 1px solid #333;
}
table#input td{
padding: 4px;
}
tr.disabled td.key{
color: #ccc;
}
tr.disabled td.value{
display: none;
}
</style>
<script type="text/javascript">
function toggleVisibility(rowElem){
rowElem.className = (rowElem.className == 'disabled') ? 'enabled' : 'disabled';
}
</script>
</head>
<body>
<table id="input">
<tr class="disabled" onclick="toggleVisibility(this);"><td class="key">title1</td><td class="value">value1</td></tr>
<tr class="disabled" onclick="toggleVisibility(this);"><td class="key">title2</td><td class="value">value2</td></tr>
</table>
</body>
</html>