bootstrap 5 个带有原版的关闭模式 javascript

Question

你好按照这里的教程 https://getbootstrap.com/docs/5.0/components/modal/#via-javascript 他们使用一个按钮来切换显示模态。如果你想在 bootstrap 5 和 javascript 中显示模态，你基本上使用 var myModal = new bootstrap.Modal(document.getElementById('staticBackdrop')); myModal.show();

我的问题是如何关闭使用按钮打开的 javascript 模式。基本上我怎样才能获得已经打开的模式的句柄？我意识到一旦我有了句柄，我就会调用 .hide()

---编辑--- 为了弄清楚这一点。在 bootstrap 5 中打开时不使用 javascript

<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
  Launch demo modal
</button>

我试图获取该模态的句柄

Answer 1

您可以使用变量myModal来调用方法。在您的按钮上使用隐藏方法单击以隐藏您的模态：myModal.hide() 从这里阅读更多关于方法的信息：https://getbootstrap.com/docs/5.0/components/modal/#methods

Answer 2

想通了。

var myModalEl = document.getElementById('staticBackdrop');
var modal = bootstrap.Modal.getInstance(myModalEl)
modal.hide();

我错过了 bootstrap.Modal.getInstance。每次我花 5 个小时盯着某样东西并寻找答案。我终于post到这里了，立马搞明白哈哈

bootstrap 5 个带有原版的关闭模式 javascript

bootstrap 5 close modal with vanilla javascript

javascript

bootstrap-modal

bootstrap-5