Bootstrap警报自动隐藏不起作用

时间:2015-12-22 12:18:58

标签: javascript c# asp.net-mvc twitter-bootstrap alert

我找到了关于在mvc项目中发出警报的好帖子。我已经从这里实现了它:http://jameschambers.com/2014/06/day-14-bootstrap-alerts-and-mvc-framework-tempdata/ 有一个_Alert局部视图

@{
    var alerts = TempData.ContainsKey(Alert.TempDataKey)
                ? (List<Alert>)TempData[Alert.TempDataKey]
                : new List<Alert>();
    if (alerts.Any())
    {
    <hr />
    }
    foreach (var alert in alerts)
    {
        var dismissableClass = alert.Dismissable? "alert-dismissable" :  null;
        <div class="alert alert-@alert.AlertStyle fade in @dismissableClass">
            @if (alert.Dismissable)
            {
                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
            }
            @Html.Raw(alert.Message)
        </div>
    }
}

我想在警报中添加自动隐藏功能。所以,我在这个视图中添加了一个脚本:

<script>
    $(document).ready(function () {
        setTimeout(function () {
            $(".alert").hide();
        }, 2000);
    });
</script>

但它不起作用,为什么呢?

1 个答案:

答案 0 :(得分:1)

document.ready在完整页面加载时触发,而不是在部分页面加载中触发。因此,$(document).ready事件在加载此部分视图后不会触发,也不会执行代码。

在局部视图的html之后编写setTimeout代码。

<script>
    setTimeout(function () {
        $(".alert").hide();
    }, 2000);
</script>