使用CSS隐藏空的可解除Bootstrap警报？

Question

我使用bootstrap 3警报来显示内联表单错误。方便的是，我可以使用以下CSS规则隐藏空警报：

.alert:empty{
    display:none;
}

我想使用bootstrap的JS来解除这些警报。 Bootstrap的示例标记如下：

<div class="alert alert-danger alert-dismissible" role="alert">
    <button type="button" class="close" data-dismiss="alert">
        <span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
    </button>
</div>

但现在警报从来没有＆＃34;：空＆＃34;因为他们持有解雇按钮。有没有什么方法可以隐藏（当排除按钮标记时为空）这些警报使用的是纯CSS还是我坚持使用JS？

Answer 1

这里，基本上在每次提醒之后，您需要脚本来检查消息div是否为空。如果是空的js代码隐藏警告标记为id：

JSFiddle：here

function hideAlert(id){
    var text = $('#'+id+' .message').text();
    console.log(text.length);    //white spaces, new lines counts to
    if(text.length <= 0)
        $('#'+id).hide();
}