Question

我希望在5秒后自动在我的网站上打开一个弹出窗口。所以我决定自动点击打开弹出窗口的按钮。所以我尝试使用：document.getElementById（'button_id'）。click（）。但是我的方法不起作用..你在我的代码中看到了问题吗？

$(document).ready(function() {
  setTimeout(function() {
    document.getElementById('button').click()
  }, 5000);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row">
  <button class="btn btn-info btn-lg button" type="submit" id="button" data-toggle="modal" data-target="#enquirypopup">SUBSCRIBE</button>
</div>

也许还有其他方法吗？使用.show（）和我的弹出式文件？

感谢。

Answer 1

为什么不使用

html如：

<div id="popup-div-id">
</div>

CSS：

#popup-div-id
{
     position:fixed;
     z-index:3000;
     top:50px;
     left:50px;
     display:none;
     background-color:red;
}

和JS：

$(document).ready(function(){

      setTimeout(function(){

           $("#popup-div-id").show();
      },5000)
}

完整页面如：

  <html>
     <body>
         <div id="popup-div-id">
         </div>

         <style>
              #popup-div-id
              {
                  position:fixed;
                  z-index:3000;
                  top:50px;
                  left:50px;
                  display:none;
                  background-color:red;
              }
         </style>
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
         <script>

             $(document).ready(function(){

                   setTimeout(function(){

                         $("#popup-div-id").show();
                    },5000)
              }               

         </script>
     </body>
  </html>

Answer 2

你可以这样做

$(document).ready(function(e) {

    setTimeout(function() {
        $('#mymodal').trigger('click');}, 5000); 


});

或为此删除data-toggle="modal" data-target="#enquirypopup"

<button class="btn btn-info btn-lg button modalpopup" data-target="enquirypopup" type="submit" id="button">SUBSCRIBE</button> $(document).ready(function(e) { setTimeout(function() { $('#enquirypopup').modal("show");}, 5000); $("body").on("click",".modalpopup" , function(){ $("#'+$(this).attr('data-target')+'").modal("show"); }); });

Answer 3

你应该使用bootstrap的内置函数来触发模态

$(document).ready(function(){

        $("#myModal").modal();

});

#myModal是模态窗口的id。

单击一个按钮以打开弹出窗口

3 个答案: