Bootstrap 5：使用 javascript 显示模式

Question

我正在使用bootstrap 5制作一个简洁的画廊，我想知道如何在 HTML 中不使用“data-bs-...”的情况下触发 bootstrap 模式（以避免重复这些 data- 属性 50 次）。

我设法获得了源代码的完整功能 javascript，但 .modal() 函数和 .show() 函数似乎不起作用。事情是这样的：

function gallery(_src) {
var fullPath = _src;
var fileName = fullPath.replace(/^.*[\\\/]/, '');
var newSrc = "./assets/img/" + fileName;
document.querySelector("div#galleryModal img").src = "./assets/img/" + fileName;

document.getElementById("galleryModal").show(); }

我在最后一行 javascript 上被阻止了。目标：触发#galleryModal。

感谢您的阅读，感谢您的帮助！

Answer 1

如果我们Create a modal instance想使用 javascript 进行操作，请检查下面的代码，您可以找到更多信息https://getbootstrap.com/docs/5.0/components/modal/#via-javascript

var galleryModal = new bootstrap.Modal(document.getElementById('galleryModal'), {
  keyboard: false
});


galleryModal.show();