在引導模式彈出框中添加關閉鏈接

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/