我正在尝试在页面加载时启动 Bootstrap 模式,而不触发 HTML 按钮或使用 jQuery。
这是我的代码:
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css">
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<div id="my-modal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Title</h4>
</div>
<div class="modal-body">
Hello World!
</div>
</div>
</div>
</div>
这在您调用时起作用
$('#my-modal').modal('show');
但我不想调用方法或触发按钮。有没有办法在页面加载时自动启动模式?
演示:Fiddle
请您参考如下方法:
为.modal
创建一个CSS类并添加display:block
。还将 in
类赋予模态 div。
<强> Working Demo 强>
CSS
.modal {
display:block;
}
HTML
<div id="my-modal" class="modal fade in">
编辑:不知何故,默认关闭功能将不起作用,您需要为此添加自定义脚本。