数秒後にフラッシュメッセージを非表示にする方法

Question

私のアプリケーションでは、ユーザーは他のユーザーにチャレンジを投稿できます。したがって、チャレンジの投稿に成功した後、同じメッセージを1つ表示しています。しかし、数秒後にこのメッセージを非表示にしたいと思います。だから私は次のコードを書いた：

$(document).ready(function(){
    setTimeout(function() {
        $("#successMessage").hide('blind', {}, 500)
    }, 5000);
});

<div id="successMessage" style="text-align:center; width:100%">
    <FONT color="green">
        <%if flash[:alert]=="Your challenge is posted successfully."%> 
            <h4><%= flash[:alert] if flash[:alert].present? %>
        <%end%>
    </font>
</div>

しかし、このコードはdiv "successMessage"を隠していません。

Answer 1

場合によっては、ボックスの表示をなしに設定するだけでは不十分で、完全に削除する方がよい場合があります。次のように：

setTimeout(function() {
    $('.alert-box').remove();
}, 30000);