根据文档.modal('dispose') https://getbootstrap.com/docs/4.0/components/modal/#modaldispose，破坏模态。
.modal('dispose')
破坏元素的模态。
但是当我创建一个eventListener using
$('#myModal').on('hidden.bs.modal', function (event) {
// Destroy modal
$('#myModal').modal('dispose');
});
模式仍然是文档的一部分。文档让我很困惑，这个方法不是用来从文档中删除模态吗？这个方法的目的是什么？
$('#myModal').modal('show');
$('#myModal').on('hidden.bs.modal', function (event) {
console.log('Destroy modal');
$('#myModal').modal('dispose');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.bundle.min.js" integrity="sha384-u/bQvRA/1bobcXlcEYpsEdFVK/vJs3+T+nXLsBYJthmdBuavHvAW6UsmqO2Gd/F9" crossorigin="anonymous"></script>
<div class="modal" tabindex="-1" role="dialog" id="myModal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>Modal body text goes here.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary">Save changes</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
它破坏了 Bootstrap 的 Modal 组件的 jQuery 实例。它不会从 DOM 中删除模态标记。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
