【问题标题】:Bootstrap Collapse:How to deactivate other buttons?Bootstrap Collapse:如何停用其他按钮?
【发布时间】:2018-12-11 10:45:39
【问题描述】:

我在使用 Bootstrap 折叠方面需要帮助。 我创建了 3 个正在折叠的按钮。事情,在我的情况下,只有一个按钮被折叠才是合乎逻辑的。 所以我想在单击按钮时停用其他按钮。 有没有办法做到这一点?

非常感谢。

<div class="panel-group" id="accordion">
    <div class="btn-group btn-group-justified" role="group">
        <div class="btn-group" role="group">
            <button class="btn btn-default" type="button" data-toggle="collapse" data-parent="#accordion" data-target="#collapseexample1" aria-expanded="false" aria-controls="collapseexample1">some example text</button>
        </div>
        <div class="btn-group" role="group">
            <button class="btn btn-default" type="button" data-toggle="collapse" data-parent="#accordion" data-target="#collapseexample2" aria-expanded="false" aria-controls="collapseexample2">some text</button>
        </div>
    </div>
</div> 

<div class="row">
    <div class="col">
        <div class="collapse multi-collapse" id="collapseexample1">
            <div class="col-lg-4">
                random text
            </div>
        </div>
        <div class="collapse multi-collapse" id="collapseexample2">
            <div class="col-lg-4"></div>
            <div class="col-lg-4>
                random text again
            </div>
            <div class="col-lg-4"></div>
        </div>
    </div>
</div>

这是我的代码的简化示例。

【问题讨论】:

  • 分享一些你得到的代码或错误。
  • 我没有收到任何错误。但是,如果我正在激活两个或更多按钮,文本或其他任何内容都没有得到正确的位置,因为我正在使用响应式列。
  • 我将在几秒钟后分享代码。
  • 你使用什么版本的引导程序
  • 我使用的是 4.0 版。

标签: jquery css twitter-bootstrap bootstrap-4 collapse


【解决方案1】:

你可以为它写一个jquery函数。获取您的按钮元素并在单击其中一个元素时切换其禁用状态。如果您搜索“bootstrap collapse expand one at the time”,您甚至应该找到很多现成的解决方案

【讨论】:

  • 是的。非常感谢。我想这是正确的方法。我想也许还有其他方法可以做到这一点。
【解决方案2】:

好的,我想我会使用手风琴。 首先,我不喜欢它们,但它们在小型设备上看起来更好。

【讨论】:

    猜你喜欢
    • 2013-05-24
    • 1970-01-01
    • 2012-06-07
    • 2016-03-14
    • 1970-01-01
    • 2021-03-12
    • 1970-01-01
    • 2012-06-02
    • 1970-01-01
    相关资源
    最近更新 更多