javascript - Bootstrap Modal 的 setTimeout 在超时后不显示

Question

我试图延迟显示 Bootstrap 模式，直到 5 秒过去。这是我的代码部分。似乎是根据我在 MDN 上阅读的内容写的。模态在任何时间后都不会出现。任何帮助将不胜感激。

var timeout;
  function modalAlert(message){
        $("#myModalLabel").text("Hey Look!")
        $('.modal-body').html("<img src='"+message+"'>");
        timeout = window.setTimeout(showModal,5000);

  }
  function showModal(){
    console.log("HERE")
    $("#myModal").modal('show')
  }

Vijay Ramamurthy 帮助我找到了解决方案:

var timeout;
  function modalAlert(message){
        $("#myModalLabel").text("Hey Look!")
        $('.modal-body').html("<img src='"+message+"'>");
        window.setTimeout(function(){showModal();},5000);

  }
  function showModal(){
    console.log("HERE")
    $("#myModal").modal('show')
  }

Answer 1

使用“显示”事件处理程序在模式上注册超时，然后将其隐藏。您可以将函数链接在一起，因为它是一个 jQuery 插件。

$("#myModal").modal("show").on("shown", function () {
    window.setTimeout(function () {
        $("#myModal").modal("hide");
    }, 5000);
});