gpt4 book ai didi

javascript - IE6 Javascript ClassName 改变显示

转载 作者:行者123 更新时间:2023-11-28 14:43:29 25 4
gpt4 key购买 nike

这是我目前在工作中遇到的问题的简化版本。代码在 Firefox 3.6 中正常运行。单击一行时,Javascript 会更改其类名,子元素的属性也应更改。

然而,在 IE6 和其他版本中,它仅适用于“title1”和“title2”TD:它们会改变颜色。不起作用的是“value1”和“value2”从 display:none 更改为默认值。我曾尝试使用 TD 的 style.display 属性,但无济于事。

如有任何帮助,我们将不胜感激。

<!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>

最佳答案

我想出了一个适用于 FF 和 IE6-8 的替代解决方案。对于每个带有 class="value"的 TD,我用 span 标签将内容括起来并对样式表进行了以下更改:

tr.disabled td.value span{
position: absolute;
top: -20px;
}

现在,当一行被禁用时,所有有值(value)的内容都应该隐藏在屏幕之外。

关于javascript - IE6 Javascript ClassName 改变显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5606374/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com