Bootstrap警報自動隱藏不起作用

Question

我發現了有關在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> 

但它不起作用，爲什麼？

Answer 1

document.ready在完整頁面加載時觸發，而不是在部分頁面加載中觸發。因此，$(document).ready事件不會在加載此部分視圖後觸發，也不會執行代碼。

在部分視圖的html後面寫入setTimeout代碼。

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