我有两个系列的数据并尝试通过单击复选框隐藏它们,但数据系列不会被隐藏。
您可以在我的fiddle中查看我的数据系列。
这就是我用来隐藏它们的代码:
CSS :
<input type="checkbox" checked="checked" class="messageCheckbox" value="line1" onclick="showOrHide(0);" />1
<input type="checkbox" value="line2" checked="checked" class="messageCheckbox" onclick="showOrHide(1);" />2
的Javascript :
showOrHide = function (i) {
var selectt = document.getElementsByClassName("messageCheckbox")[i].value;
if (document.getElementsByClassName("messageCheckbox")[i].checked) {
document.getElementsByClassName(selectt)[0].style.display = 'none';
} else {
document.getElementsByClassName(selectt)[0].style.display = 'block';
}
}
答案 0 :(得分:0)
为此,您需要设置属性visibility
- http://jsfiddle.net/TrpcW/4/
<body>
<div class="line1">data1</div><div class="line2">data2</div>
<input type="checkbox" class="messageCheckbox" value="line1" onclick="showOrHide(0);" unchecked />1
<input type="checkbox" value="line2" class="messageCheckbox" onclick="showOrHide(1);" unchecked />2
</body>
showOrHide = function (i) {
var selectt = document.getElementsByClassName("messageCheckbox")[i].value;
if (document.getElementsByClassName("messageCheckbox")[i].checked) {
document.getElementsByClassName(selectt)[0].style.visibility = "hidden";
} else {
document.getElementsByClassName(selectt)[0].style.visibility = "visible";
}
}