Question

我正在弄乱一个包含三个p的小div。如果用户点击任何一个p，它们都会消失。有一个小按钮可以阅读内容。我正在寻找一种方法来删除内容而不关闭div。

以下是我的。

<script>
    $(function () 
    {
        $("p, button").click(function () 
        {
           $("p").toggle();
        })
    });
</script>
<div id="blarg" class="blarg" style="visibility: visible;">
    <p class="test" style="display: block;">If you click on me, I will disappear.</p>
    <p class="test" style="display: block;">Click me away!</p>
    <p class="test" style="display: block;">Click me too!</p>
</div>
<button>Readd</button>

Answer 1

css样式visiblity可以为您完成此操作。您只需将其设置为visibility:hidden，如下所示：

$(function () 
{
     $("p, button").click(function () 
     {
         $(this).css("visibility","hidden");
     })

});

Answer 2

切换是使用“显示”，这使得项目占用空间，我认为你想使用visibility，这不会影响布局，只是它......可见性。

Answer 3

点击后在每个visibility: hidden;元素上设置p。

.hidden {
  visibility: hidden;
}

$("p, button").click(function () {
  $(this).toggleClass("hidden");
});

编辑：好抓人......写得太快了。

如何在没有内容空间关闭的情况下使div内的内容消失？ - jquery

3 个答案: