使動態警報出現的按鈕只出現一次，然後停止

Question

我使用Bootstrap，我有一個可按下按鈕出現的可摺疊div，然後在5秒後消失。 問題是，它只能使用一次。當我再次按下按鈕時，在div消失後，沒有任何反應。 我能做些什麼來使按鈕重複一次再次按下的動作？ 這裏是我的代碼：

<button type="button" class="btn btn-primary" data-dismiss="modal" data-toggle="collapse" data-target="#aparecer1"> 
    Suscribir 
</button> 

<div id="aparecer1" class="alert alert-warning collapse"> 
    This is an alert 
</div> 

$("button").click(function() { 
    setTimeout(function() { 
     $('#aparecer1').fadeOut('fast'); 
    }, 5000); 
}); 

非常感謝！

Answer 1

有兩個原因不起作用。首先，將​​呼叫結果display: none設置在內聯元素上，該元素覆蓋樣式以在下一次單擊時應用該元素。它需要被刪除。您還需要刪除由Bootstrap添加的元素上的in類。您可以在​​回調做這兩個動作，就像這樣：

$("button").click(function() { 
    setTimeout(function() { 
     $('#aparecer1').fadeOut('fast', function() { 
      $(this).css('display', '').removeClass('in'); 
     }); 
    }, 5000); 
}); 

Example fiddle

Answer 2

不要完全隱藏你的警報標記。只要刪除類insted它將解決您的問題。

$("button").click(function() { 
    setTimeout(function() { 
     $('#aparecer1').removeClass('in'); 
    }, 5000); 
}); 

Updated Fiddle