Question

给出来自bootstrap网站的以下代码以获取折叠功能：

<a class="btn btn-primary" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
  Link with href
</a> 
<div class="collapse" id="collapseExample">
  <div class="well">
    ...
  </div>
</div>

我想要做的是隐藏链接，一旦打开就调用折叠功能，有没有人知道我可以这样做而不添加额外的J？

Answer 1

在单击按钮后，我用它来隐藏按钮：

HTML（仅添加了一个“隐藏我”类）：

<button class="btn btn-default hide-me" data-toggle="collapse" data-target="#search" id="search-display">My Button</button>

CSS：

.hide-me[aria-expanded="true"] {display: none;}

Answer 2

这就是我真正想要的'，没有我自己的CSS或JavaScript，只需利用Bootstrap：

<a class="btn btn-primary hook in" data-toggle="collapse" href=".hook" aria-expanded="false" aria-controls="collapseExample">
  Link with href
</a> 
<div class="collapse hook">
  <div class="well">
    ...
  </div>
</div>

这是小提琴：

http://jsfiddle.net/hptrpaxh/1/

Answer 3

添加：

$('.btn').toggle();

我建议你在这个按钮上添加一个额外的类，或者给它一个id来区别于其他按钮。

Answer 4

抱歉没有看到你没有额外的js试图这样做。这是一个简单的CSS技巧。您显然可以修改它

给按钮一个类似隐藏按钮的类然后使用这个CSS

.hidden-button {
    position:relative;
    z-index:0;
}


.well {
    position:relative;
    margin-top:-33px;
    z-index:10000;
}

这是一个小提琴http://jsfiddle.net/cp5Lvtdo/4/

崩溃后隐藏按钮在引导程序中切换

4 个答案: