在頁面加載時啟動模式

Question

我正在嘗試在頁面加載時啟動模式。 問題是我無法進入頭部。

我用按鈕創建了一個模態。 如果單擊該按鈕，將顯示模式。 現在，我嘗試隱藏按鈕，然后使用javascript模擬點擊。 我希望模態會顯示出來。 但事實並非如此。
應該為“ document.getElementById（” hiddenbutton“）。click（）;” 不觸發按鈕？

<button id="hiddenbutton" type="button"  data-toggle="modal" data-target="#modal_default" style="display: none;"></button>
                <!-- Basic modal -->
            <div id="modal_default" class="modal fade">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal">&times;</button>
                            <h5 class="modal-title">Basic modal</h5>
                        </div>

                        <div class="modal-body">
                            <h6 class="text-semibold">Text in a modal</h6>
                            <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>

                            <hr>

                            <h6 class="text-semibold">Another paragraph</h6>
                            <p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
                            <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
                        </div>

                        <div class="modal-footer">
                            <button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
                            <button type="button" class="btn btn-primary">Save changes</button>
                        </div>
                    </div>
                </div>
            </div>
            <!-- /basic modal -->


<script type="text/javascript">   

    document.getElementById("hiddenbutton").click();        

謝謝

Answer 1

似乎您正在使用引導程序，因此可以使用$('#modal_default').modal('show')來顯示模態。

您不需要訪問head 。 只需將此JavaScript代碼添加到您的頁面即可：

<script type="text/javascript">
$(function() {
    $('#modal_default').modal('show');
})
</script>

Answer 2

將此腳本放在頁面的開頭：

<script type="text/javascript">

   $(document).ready(function()
   {
       $('#modal_default').modal('show');
   });

</script>

但是，請確保在執行上述代碼段之前，在頁面中導入bootstrap.js和jQuery.js。