如何隐藏DIV后面的复选框答案

【问题标题】：How to hide a checkbox behind a DIV如何隐藏DIV后面的复选框
【发布时间】：2012-05-02 00:17:47
【问题描述】：

<div style="padding-top:5px; overflow:hidden; font-size:13px;">
    <div style="float:left;">
        <div style="background-color:blue; width:20px;">
            <input type="checkbox" id="rememberme" style="z-index:-1;" />
        </div>
    </div>
    <div style="float:left;">
        Remember Me
    </div>
    <div style="float:right;">
        <a href="" id="forgotpassword"> Forgot Password ? </a>
    </div>
</div>

我想隐藏父 DIV 后面的复选框。

我为复选框尝试了VISIBILITY:HIDDEN;，但我想创建一个 jQuery 函数，我单击此复选框并且应该会发生一些事情，但是当它被隐藏时它没有发生，当我再次显示它时，它起作用了，所以我不想使用HIDDEN，但我想把它放在div后面，所以它不会显示出来。

这段代码不起作用，我用z-index=-1，后来用z-index:20作为父DIV，它不起作用:(

【问题讨论】：

标签： css html checkbox hide visibility

【解决方案1】：

您不需要将复选框隐藏在 div 后面。

尝试在元素上使用display:none;：

#rememberme {
    display: none;
}

【讨论】：

我想稍后再做一个自定义的复选框，这只是一个测试，背景颜色只是一个测试，如果我使用 display:none，我怎么能点击它？
在那种情况下，你为什么需要一个复选框？改用小 div，您可以在其上添加点击事件和相应的操作。

【解决方案2】：

是的阿里，现在你可以自定义复选框，这里是示例http://jsfiddle.net/chanduzalte/7rSug/3/

【讨论】：