在引导模式弹出框中添加关闭链接

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/