问题在隐藏我的数据与复选框 [英] issue in hiding my data with checkbox

查看:153
本文介绍了问题在隐藏我的数据与复选框的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有两个数据系列,并试图通过点击复选框隐藏它们,但是数据系列不隐藏。

I have two series of data and trying to hide them by clicking on the check box but the data series do not get hidden.

您可以看到我的数据系列在我的小提琴中。

You can see my data series in my fiddle.

这是我已用于隐藏他们的代码:

And that is the code I have used for hiding them:

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';
    }
}


推荐答案

您需要设置属性 visibility - http:/ /jsfiddle.net/TrpcW/4/

For this, you need to set the attribute 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";
    }
}

这篇关于问题在隐藏我的数据与复选框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆