如何在不按下按钮的情况下调用javascript模式

我有以下按钮：

<button data-toggle="tk-modal-demo" data-modal-options="slide-left" data-dialog-options="sidebar sidebar-size-3 sidebar-size-xs-1 sidebar-offset-0 left" class="btn btn-primary">Slide left</button>

向左滑动

这称为模态：

<script id="tk-modal-demo" type="text/x-handlebars-template">
              <div class="modal fade">
                <div class="modal-dialog">
                  <div class="v-cell">
                    <div class="modal-content">
                      <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                        <h4 class="modal-title">Modal title</h4>
                      </div>
                      <div class="modal-body">
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit. A aperiam atque consequuntur dolore fugiat fugit hic in ipsam iure magnam maxime quaerat, quam qui repellat repellendus temporibus vel vitae voluptate!
                      </div>
                      <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="button" class="btn btn-primary" data-dismiss="modal">Save</button>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </script>

&时代；接近
情态标题
Lorem ipsum dolor sit amet，奉献精英。一张开胃纸，用它来形容你的伟大，它是你生命中的暂时驱避剂！
接近
拯救

如何在页面加载时而不是按下按钮时弹出模式？换句话说，我应该调用什么javascript

---

类似于

tk-modal-demo（）

？

最简单的选择是将

show

类添加到您的模态中：

<script id="tk-modal-demo" type="text/x-handlebars-template">
    <div class="modal show fade">
        <div class="modal-dialog">
          <div class="v-cell">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                 <span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">Modal title</h4>
              </div>
              <div class="modal-body">
                Lorem ipsum dolor sit amet, consectetur adipisicing elit. A aperiam atque consequuntur dolore fugiat fugit hic in ipsam iure magnam maxime quaerat, quam qui repellat repellendus temporibus vel vitae voluptate!
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" data-dismiss="modal">Save</button>
              </div>
            </div>
          </div>
        </div>
      </div>
</script>

&时代；接近
情态标题
Lorem ipsum dolor sit amet，奉献精英。一张开胃纸，用它来形容你的伟大，它是你生命中的暂时驱避剂！
接近
拯救

最简单的选择是将

show

类添加到您的模式：

<script id="tk-modal-demo" type="text/x-handlebars-template">
    <div class="modal show fade">
        <div class="modal-dialog">
          <div class="v-cell">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                 <span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">Modal title</h4>
              </div>
              <div class="modal-body">
                Lorem ipsum dolor sit amet, consectetur adipisicing elit. A aperiam atque consequuntur dolore fugiat fugit hic in ipsam iure magnam maxime quaerat, quam qui repellat repellendus temporibus vel vitae voluptate!
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" data-dismiss="modal">Save</button>
              </div>
            </div>
          </div>
        </div>
      </div>
</script>

&时代；接近
情态标题
Lorem ipsum dolor sit amet，奉献精英。一张开胃纸，用它来形容你的伟大，它是你生命中的暂时驱避剂！
接近
拯救

您可以使用Javascript单击按钮：

document.querySelector('button[data-toggle="tk-modal-demo"]').click()

但是我强烈建议阅读模态的文档，必须有一个显示/隐藏的函数。例如如果是引导模式，则可以如下所示：

$('#tk-modal-demo').modal('show');

---

要在页面加载时进行调用，请执行以下操作：

window.addEventListener('load', function() {
  // CODE GOES HERE
});

或者，如果您使用jQuery：

$(window).on('load',function() {
  // CODE GOES HERE
});

---

您可以使用Javascript单击该按钮：

document.querySelector('button[data-toggle="tk-modal-demo"]').click()

但是我强烈建议阅读模态的文档，必须有一个显示/隐藏的函数。例如如果是引导模式，则可以如下所示：

$('#tk-modal-demo').modal('show');

---

要在页面加载时进行调用，请执行以下操作：

window.addEventListener('load', function() {
  // CODE GOES HERE
});

或者，如果您使用jQuery：

$(window).on('load',function() {
  // CODE GOES HERE
});

---

您可以将

show

和

in

中的类添加到HTML中，如下所示：

<div class="modal fade show in">

请参见下面的运行演示

$（函数（）{
/*或者可以通过编程方式调用“show”方法*/
//美元（“.modal”）.modal（“show”）；
});

内容
&时代；接近
情态标题
Lorem ipsum dolor sit amet，奉献精英。一张开胃纸，用它来形容你的伟大，它是你生命中的暂时驱避剂！
接近
拯救
您可以将
show
和
in
中的类添加到HTML中，如下所示：

<div class="modal fade show in">

请参见下面的运行演示


$（函数（）{
/*或者可以通过编程方式调用“show”方法*/
//美元（“.modal”）.modal（“show”）；
});

内容
&时代；接近
情态标题
Lorem ipsum dolor sit amet，奉献精英。一张开胃纸，用它来形容你的伟大，它是你生命中的暂时驱避剂！
接近
拯救
@CrisMVP3200这是我的问题，我该怎么做？我投票结束这个问题，因为答案在引导程序中documentation@charlietfl我是一个自举的傻瓜。这就是为什么我在未来为自己和他人提出这个问题。新的文档也是如此。在阅读文档之前，在加载时打电话“show”在这里询问，这是完全可以理解的lazy@CrisMVP3200这是我的问题，我该怎么做？我投票结束这个问题，因为答案在引导程序中documentation@charlietfl我是一个自举的傻瓜。这就是为什么我在未来为自己和他人提出这个问题。新文档也是如此。在阅读文档之前，在加载时调用“show”在这里询问完全是懒惰