Bootstrap模态火但没有显示

Question

我尝试使用bootstrap模式，事件'show'被触发，但我无法在屏幕上看到它。 home.js

$(document).ready(function(){
    console.log("Log...");

    $(document).on('click', '#btnSignIn', function(){
        console.log("Starting modal..");
        $('#modal').on('show.bs.modal', function(){
            alert("Modal show..");
        }).modal('show');
    });
});

home.jsp中的模态

<!-- Modal -->
        <div id="modal" class="modal hide fade" tabindex="-1" role="dialog"
            aria-labelledby="myModalLabel" aria-hidden="false">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                    aria-hidden="true">×</button>
                <h3 id="myModalLabel">Modal header</h3>
            </div>
            <div class="modal-body">
                <h1>AKA</h1>
            </div>
            <div class="modal-footer">
                <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
                <button class="btn btn-primary">Save changes</button>
            </div>
        </div>

警告被触发，但是没有显示模态。有人可以帮帮我吗？请

Answer 1

如果您使用Bootstrap 3，则需要从模态html中删除隐藏类：

改变这个：

 <!-- Modal -->
    <div id="modal" class="modal hide fade" tabindex="-1" role="dialog"

对此：

  <!-- Modal -->
    <div id="modal" class="modal fade" tabindex="-1" role="dialog"