【问题标题】:Bootstrap modal not showing on page load [duplicate]页面加载时未显示引导模式 [重复]
【发布时间】:2016-01-04 06:50:47
【问题描述】:

我正在尝试在这样的页面加载时显示引导模式

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.js"></script>
    <script src="js/bootstrap.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function(){                  
          $('#mapModal').modal('show'); 
        });
    </script> 

  <div id="mapModal" class="modal fade" role="dialog">
<div class="modal-dialog">

  <!-- Modal content-->
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
      <h4 class="modal-title">Seller Location</h4>
    </div>
    <div class="modal-body">
      Some content 
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
  </div>

</div>
</div>

页面加载时,整个页面出现黑色覆盖,但模态窗口不显示

编辑:

我试过$(window).load(function (){ });but that also does nothing

【问题讨论】:

  • 尝试使用$(window).load(function() { /* code here */ });
  • 这不起作用甚至没有给我警报不知道为什么 $(window).load(function() { alert('hi'); });

标签: javascript jquery html css twitter-bootstrap


【解决方案1】:

尽量使用低版本的jQuery。

未捕获的错误:Bootstrap 的 JavaScript 需要 jQuery 版本 1.9.1 或更高版本,但是 低于版本 3

【讨论】:

    【解决方案2】:

    我得到了您的错误解决方案,您只需使用 bootstrap 版本 3.3.1

    使用:

    CSS : -- https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css

    JS -- https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js

    和jquery版本——code.jquery.com/jquery-1.11.1.min.js

    【讨论】:

      猜你喜欢
      • 2018-05-09
      • 1970-01-01
      • 2021-12-12
      • 1970-01-01
      • 2013-05-11
      • 2015-03-20
      • 2016-04-29
      • 1970-01-01
      • 2021-11-11
      相关资源
      最近更新 更多