关闭所有模式 bootstrap

Question

我想用一行代码关闭所有模态框，我有一个代码是这样的：

closeModals() {

    $('#new-user').modal('hide');
    $('#new-project').modal('hide');
    $('#new-task').modal('hide');
}

但问题是我的项目中有超过20个模态，有没有办法关闭所有模态而不重复每个模态的id？ 谢谢！

Answer 1

如果您可以将 class 添加到您可以调用的元素。

$('.my-modals').modal('hide');

Answer 2

您可以 select 通过 javascript 所有模式的 class 并关闭它们。

Bootstrap < 5

$('.modal').modal('hide');

Bootstrap >= 5

document.querySelectorAll('.modal').forEach(function(modalElem) {
    const myModal = new bootstrap.Modal(modalElem);
    myModal.hide();
});