Twitter Bootstrap 2.3.2 模型不停留在屏幕上

Twitter Bootstrap 2.3.2 Model not staying on screen

本文关键字:停留在 屏幕 模型 Bootstrap Twitter      更新时间:2023-09-26

这些都是我链接的Javascript文件:

<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
    <script src="bootstrap/docs/assets/js/jquery.js"></script>
    <script src="bootstrap/docs/assets/js/bootstrap.js"></script>
    <script src="bootstrap/docs/assets/js/bootstrap-transition.js"></script>
    <script src="bootstrap/docs/assets/js/bootstrap-dropdown.js"></script>
    <script src="bootstrap/docs/assets/js/bootstrap-button.js"></script>
    <script src="bootstrap/docs/assets/js/bootstrap-collapse.js"></script>
    <script src="bootstrap/docs/assets/js/bootstrap-carousel.js"></script>
    <script src="bootstrap/docs/assets/js/bootstrap-typeahead.js"></script>
    <script src="bootstrap/docs/assets/js/bootstrap-affix.js"></script>
    <script src="bootstrap/docs/assets/js/bootstrap.min.js"></script>
    <script src="bootstrap/docs/assets/js/holder/holder.js"></script>
    <script src="bootstrap/docs/assets/js/google-code-prettify/prettify.js"></script>
    <script src="bootstrap/assets/js/application.js"></script>

这些是我链接的所有CSS文件:

<link href="css/bootstrap.min.css" rel="stylesheet" media="all" /> 
<link href="css/bootstrap.css" rel="stylesheet" media="all" />
<link href="css/style.css" rel="stylesheet" media="all" />

这是我的模型:

<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Modal header</h3>
  </div>
  <div class="modal-body">
    <p>One fine body…</p>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary">Save changes</button>
  </div>
</div>

我遇到的问题是,当我单击按钮启动模型时,它只会在我的屏幕上弹出 1 秒钟,然后它就会消失。由于某种原因,它没有停留在屏幕上。

嘿,

它对我来说工作正常。杰斯菲德尔演示

此外,您只需要添加bootstrap.cssbootstrap.min.css中的任何一个。

实际上bootstrap.min.css只是bootstrap.css的压缩版本。

您不需要添加所有 JavaScript 文件。

一个基本的例子:

<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet" media="all" /> 
<script src="http://getbootstrap.com/2.3.2/assets/js/jquery.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-modal.js"></script>
<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Modal header</h3>
  </div>
  <div class="modal-body">
    <p>One fine body…</p>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary">Save changes</button>
  </div>
</div>

要测试它,只需将上面的代码复制到文本编辑器中并将其另存为**.html,然后在某个浏览器上打开它

我发现了我的问题。我需要删除

<script src="bootstrap/docs/assets/js/bootstrap.min.js"></script>

猜你不能包括bootstrap.min.js