【问题标题】:Bootstrap Collapsible Menu not working when clicking单击时引导可折叠菜单不起作用
【发布时间】:2016-07-16 18:03:30
【问题描述】:

我在 Bootstrap 中的可折叠菜单似乎无法正常工作 - 谁能帮我有什么问题?现在它显示 Collapsible Menu ,但单击它在视觉上没有任何作用 工作室 2015,但它在 w3school 示例中工作,这里: w3school collapsible menu example

<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <link href="Content/bootstrap.css" rel="stylesheet" />

</head>
<body>

    <div class="container">
        <h2>Simple Collapsible</h2>
        <button type="button" class="btn btn-info" data-toggle="collapse" data-target="#demo">Simple collapsible</button>
        <div id="demo" class="collapse">
            Lorem ipsum dolor sit amet, consectetur adipisicing elit,
            sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
            quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
        </div>
    </div>

    <script src="Scripts/jquery-3.1.0.min.js"></script>
    <script src="Scripts/bootstrap.min.js"></script>
</body>
</html>

【问题讨论】:

标签: html css twitter-bootstrap twitter-bootstrap-3


【解决方案1】:

请根据您的代码参考代码及其工作正常

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
    <div class="container">
        <h2>Simple Collapsible</h2>
        <button type="button" class="btn btn-info" data-toggle="collapse" data-target="#demo">Simple collapsible</button>
        <div id="demo" class="collapse">
            Lorem ipsum dolor sit amet, consectetur adipisicing elit,
            sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
            quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
        </div>
    </div>
</body>
</html>

【讨论】:

    猜你喜欢
    • 2015-01-18
    • 1970-01-01
    • 2017-07-23
    • 2018-12-14
    • 2015-01-12
    • 1970-01-01
    • 2018-04-18
    • 1970-01-01
    • 2018-05-12
    相关资源
    最近更新 更多