Question

我对Bootstrap和网页设计一般都很新。我只是不明白为什么Bootstrap中的某些东西不起作用！我目前正在尝试使用模态。

触发：

<a data-toggle="modal" href="#myModal" class="btn btn-primary btn-lg">Launch demo modal</a>

模态：

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
      <h4 class="modal-title">Modal title</h4>
    </div>
    <div class="modal-body">
      ...
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      <button type="button" class="btn btn-primary">Save changes</button>
    </div>
  </div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->

我已经尝试制作自己的Modal并且它不起作用，所以我甚至只是从Stack Overflow文章中删除了这段代码，它似乎对我没用。

为什么它不起作用？

脚本：

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="js/init.js"></script>

Answer 1

假设您正在使用Bootstrap 3，正如此代码所示，代码是正确的。您是否在页面标题中包含了bootstrap.js或bootstrap.min.js资产？模态需要这些js文件中的任何一个。

Answer 2

这个解决方案肯定会有用，但这不是一个好主意，据我所知，你想在锚点上显示模态。只做一件事。在锚上点击使用此..

$(function(){
  $('.btn-lg').click(function(){
    $('#myModal').toggleClass('in');
  });
});

如果您愿意，请告诉我，如果您愿意，我会创建一个代码段。

Bootstrap - Modal不工作？

2 个答案: