在引导模式弹出窗口上添加关闭链接

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/