單擊后Bootstrap崩潰無法保持打開狀態

Question

我已經安裝了laravel和vue js並使用了bootstrap。 我正在嘗試使用bootstrap崩潰。 但是，當我單擊以打開折疊項時，它會打開一段時間，然后消失。 這是我的代碼

<a href="#demo" class="btn btn-info" data-toggle="collapse">Simple collapsible</a>
<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>

我試圖使用$('.collapse').collapse(); 但如果注釋此行或保留它，則不會產生任何效果。 賽恩結果。

知道有什么問題嗎？ 控制台中也沒有錯誤。

謝謝

Answer 1

您錯過了數據目標屬性，並且不需要為標簽設置href標簽。
檢查以下代碼段以獲取工作代碼。

 <html> <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <h2>Simple Collapsible</h2> <a class="btn btn-info" data-toggle="collapse" data-target="#demo">Simple collapsible</a> <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>

Answer 2

加上maulik的答案：

如果使用的是v4，請確保您的jquery / bootstrap.min.js是正確的版本。

https://getbootstrap.com/docs/4.0/getting-started/introduction/#js

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

單擊后Bootstrap崩潰無法保持打開狀態

問題描述

2 個解決方案

解決方案1
2 2018-02-12 06:56:29

解決方案2
1 2019-01-23 16:47:04

單擊后Bootstrap崩潰無法保持打開狀態

問題描述

2 個解決方案

解決方案1 2 2018-02-12 06:56:29

解決方案2 1 2019-01-23 16:47:04

解決方案1
2 2018-02-12 06:56:29

解決方案2
1 2019-01-23 16:47:04