twitter-bootstrap Bootstrap 4 模式隐藏不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/47465236/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap 4 Modal Hide Not Working
提问by user3693281
In Bootstrap v3.3.7 the below code works fine. I have recently attempted to upgrade to Bootstrap v4.0.0-beta.2 for some reason it no longer works.
在 Bootstrap v3.3.7 中，下面的代码工作正常。由于某种原因，我最近尝试升级到 Bootstrap v4.0.0-beta.2，它不再有效。
What I am doing is showing a modal div that has as a spinner on it. I then go and load the rest of page and when all done loading the rest of the page I close the modal div. Again worked fine in v3, no longer works in v4. I can however open the console and run $("#divLoading").modal('hide'); and the div goes away.
我正在做的是显示一个模态 div，它上面有一个微调器。然后我去加载页面的其余部分，当加载完页面的其余部分后，我关闭模态 div。在 v3 中再次运行良好，在 v4 中不再运行。但是我可以打开控制台并运行 $("#divLoading").modal('hide'); 和 div 消失了。
FIDDLE Boostsrap v4 [BROKE]: https://jsfiddle.net/gc1097oh/
FIDDLE Bootstrap v3 [WORKS]: https://jsfiddle.net/7skoLo2q/
FIDDLE Boostsrap v4 [BROKE]：https:
//jsfiddle.net/gc1097oh/ FIDDLE Bootstrap v3 [工作]：https: //jsfiddle.net/7skoLo2q/
<div id="divMain" class="Main">
<div id="divLoading" class="modal fade">
<div class="loader">
<br />
<br />
loading div actual div has a spinner but not need to show error
</div>
<div class="modal-dialog invisible">
</div>
</div>
</div>
Javascript:
Javascript：
<script type="text/javascript">
$(function () {
showLoading();
//do some work then hide
hideLoading();
});
function showLoading() {
$('#divLoading').modal({
backdrop: 'static',
keyboard: false
});
}
function hideLoading() {
$("#divLoading").modal('hide');
}
</script>
采纳答案by dferenc
Modals are created in an asynchronous manner, but you are calling your showLoading()and hideLoading()functions in a synchronous way. You can check if the modal has been displayed already in your hideLoading function like so:
模态以异步方式创建，但您以同步方式调用您的showLoading()和hideLoading()函数。您可以检查模式是否已经显示在您的 hideLoading 函数中，如下所示：
function hideLoading() {
$('#divLoading').on('shown.bs.modal', function (e) {
$("#divLoading").modal('hide');
})
}
