单击时在Twitter Bootstrap中隐藏模式

Question

这是来自twitter bootstrap的示例代码。。。

<div class="modal">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3>Modal header</h3>
    </div>
    <div class="modal-body">
        <p>One fine body…</p>
    </div>
    <div class="modal-footer">
        <a href="#" class="btn">Close</a>
        <a href="#" class="btn btn-primary">Save changes</a>
    </div>
</div>

情况是这样的：我有一个重定向页面，我想显示模式。是的，我当然使它显示了，但是如何关闭它呢？我尝试了不同的点击功能，但没有任何反应。

Answer 1

从引导文档：

手动隐藏模式。

.modal('hide')

$('.modal').modal('hide')

因此，如果您想隐藏它，click可以将此操作绑定到click event

$('#yourid').on('click' , function() { 
  $('.modal').modal('hide')
});

如果您想在加载文档后将其隐藏一秒钟，可以尝试使用 timeout

$(function(){  //document ready
..
.. //your code
..

 setTimeout(function(){
       $('.modal').modal('hide')
 }, 2000);  //2000 = 2 second

..
})

更新1

要将其收紧，button给他一个class或id

<a href="#" class="btn closebtn">Close</a>

现在

$('.closebtn').on('click',function() {
   $('.modal').modal('hide');
});

如果您只想绑定，请close button使用id而不是class