在引導模式彈出窗口上添加關閉鏈接

Question

我有一個彈出窗口表單，並且我使用了引導模態來使其工作。 這是窗口的ID和類。

<div class="modal hide" id="myModal">

<a href="#" class="close-modal" id="close-modal">Close</a>

<div class="modal-header">
<p>Hello there!</p>
</div>


<div class="modal-body">
<!--email form-->
</div>

</div>

我使用此jquery代碼使其工作。 但是仍然不起作用。

<script type="text/javascript">
$(document).ready(function(){
    $('#myModal').hide(); //hides the modal div to be displayed later
    $('#close-modal').on('click', function(){ 
        $('#myModal, #close-modal').toggle();
        $('#myModal').modal();
    });

    $('#close-modal').on('click', function(){ 
        $('#myModal').modal.close();
        $('#myModal, #close-modal').toggle();
    });
});
</script>

Answer 1

試着做：

<script type="text/javascript">
$(document).ready(function(){
    $('#myModal').hide(); //hides the modal div to be displayed later

    $(document).on('click', '#close-modal' , function(){ 
        $('#myModal').modal('hide');
    });
});
</script>

Answer 2

<script type="text/javascript">
      $(document).ready(function(){
        $('#myModal').hide(); //hides the modal div to be displayed later
        $('#close-modal').on('click', function(){ 
           //Hide model with animation->$("#myModal").animate({opacity:'hide'}, 400);
            $("#myModal").hide();
        });  
    });
</script>

上面的代碼將在關閉鏈接上隱藏模式彈出窗口，單擊“檢查工作示例”以獲取更多詳細信息。 http://jsfiddle.net/NB3JT/light/