Question

<div class="container">
        <div class="dropdown">
            <button class="btn btn-success dropdown-toggle" type="button" data-toggle="dropdown">Success<span class="caret"></span></button>
            <ul class="dropdown-menu">
                <li><a href="#">Home</a></li>
                <li><a href="#">About</a></li>
                <li><a href="#">Articles</a></li>
                <li class="divider"></li>
                <li class="dropdown-header">Header</li>
                <li><a href="#">Login</a></li>
            </ul>
        </div><br /><br />

        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
                Dropdown
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
                <li role="presentation" class="divider"></li>
                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
            </ul>
        </div><br /><br />
        <button class="btn btn-primary" data-toggle="collapse" data-target="col1">Collapse</button>
        <div class="collapse" id="col1">
            <p>Leslie tried Bootstrap</p>
        </div>
        <br /><br />
    </div>

Answer 1

您需要更改数据目标以使＃符号表示ID：

<button class="btn btn-primary" data-toggle="collapse" 
data-target="#col1">Collapse</button>

以下是它的一个小提琴：https://jsfiddle.net/DTcHh/21983/

文档为here

你应该读它：）

Bootstrap 3可折叠按钮无法正常工作，即使它们中的一部分是从Bootstrap示例中复制的

1 个答案: