使用java脚本引导5隐藏模式

Question

我打开模态使用

document.getElementById('openLoginFormBTN').addEventListener('click', function (event) {
        let loginFormModal= new bootstrap.Modal(document.getElementById('loginModal'));
          loginFormModal.show();
    });

它工作得很好，但是当我想关闭它的时候

...
console.log("user logged in")
let loginFormModal= new bootstrap.Modal(document.getElementById('loginModal'));
loginFormModal.hide();
...

它不想关门。

Answer 1

我相信您可以依赖getOrCreateInstance方法。一旦有了实例，就不需要再取消模式了。

const btnShow = document.getElementById('openLoginFormBTN');
const modalEl = document.getElementById('loginModal');
const loginFormModal = bootstrap.Modal.getOrCreateInstance(modalEl);

btnShow.addEventListener('click', function (event) {
    loginFormModal.show();
});

loginFormModal.hide();

我创建了一个演示，您可以在这里玩这个。我不确定我是否达到了你用例的目标。请详细说明，以防我漏掉了什么东西。