如何从 Vanilla Javascript 打开 Bootstrap 3 模态框

Question

我试过这样打开模态框。

window.getElementById("modal-box-click-counter").showModal();

和

var modal = document.getElementById("modal-box-click-counter");
      modal.modal("show");

这是我要开始工作的整个脚本：

function clickCounter() {
  var clicks;

  function loadClicks() {
    clicks = sessionStorage.getItem("clickcount");
  }

  function setClicks() {
    sessionStorage.setItem("clickcount", clicks);
  }

  function init() {
    loadClicks();

    if (clicks >= 4) {
      console.log("WORKING " + clicks);

      // I WANT THIS TO WORK.
      $("#modal-box-click-counter").modal("show");

    } else {
      clicks++;
      setClicks();
      console.log(clicks);
    }
  }

  if (typeof Storage !== "undefined") {
    window.addEventListener("click", init);
  } else {
    console.log("Sorry, your browser does not support web storage...");
  }
}

window.addEventListener("load", clickCounter);

但我无法让它工作。我在函数中以正确的顺序加载了 JQuery 和 Bootstrap。

Answer 1

如果您没有 egde 案例，您可以简单地使用官方引导示例：Modal Live Demo 3.4