Bootstrap 的 API 有写:
modal('show') 用于手动打开模态框
$('#identifier').modal('show')
modal('hide') 用于手动隐藏模态框
$('#identifier').modal('hide')
奇怪现象,执行 modal('show') 方法,弹出模态框。然后,执行 modal('hide') 方法时,模态框并未关闭……
经过排查发现,主要有两方面的原因引起:
1、模态框的结构不完整,至少需要同时包含 modal、modal-dialog、modal-body 等三层结构,参考如下:
<div class="modal fade" id="loadingModal" backdrop="static" keyboard="false">
<div class="modal-dialog">
<div class="modal-body">
这里放置模态框内容
</div>
</div>
</div>
2、modal('show') 和 modal('hide') 执行间隔时间不能太短,否则不生效,采用延迟执行 modal('hide') 的方式解决。
// 设置延迟1秒后执行 .modal('hide') 方法
setTimeout(function(){ $('#loadingModal').modal('hide'); },1000);