html5 – twitter-bootstrap关闭警报不起作用

我不能让它上班当我点击关闭按钮,没有任何反应.

这里是代码：

<div class=" alert alert-error alert-block" style="width:200px" >
    <button class="close" data-dismiss="alert">&times;</button>
        <span>errors</span>            
    </div>

我已经转载了关于jsfiddler的问题：http://jsfiddle.net/graphicsxp/7L7Nd/

编辑

@using (Html.BeginForm(null,null,FormMethod.Post,new { id = "quoteWizard" }))
{
    <input type="hidden" id="ModelType" value="CarQuoteRequestviewmodel" />


    ViewBag.ValidationSummaryClass = ViewData.ModelState.IsValid ? "validation-summary-valid" : "validation-summary-errors";

    <div class="@ViewBag.ValidationSummaryClass alert alert-error in fade" data-valmsg-summary="true">
    <button class="close" data-dismiss="alert">&times;</button>
        <span>Before you can continue,please make sure you have completed the mandatory fields
            highlighted below.</span>
        <ul style="display: none" />
    </div>



    @RenderSection("QuoteSection")

    <div class="ui-formwizard-nav">
        <input id="back" value="@Resource.Global.PrevIoUs" type="reset" class="btn btn-primary" />
        <input id="next" value="@Resource.Global.Next" class="btn btn-primary" type="submit" />
    </div>
}

解决方法

看来,您包含Javascript源的顺序很重要.首先加载jQuery,然后加载引导Javascript.

例如.这失败了：

<script src="/js/vendor/bootstrap.min.js"></script>
<script src="/js/vendor/jquery-1.9.1.min.js"></script>

这样做：

<script src="/js/vendor/jquery-1.9.1.min.js"></script>
<script src="/js/vendor/bootstrap.min.js"></script>

您还将在示例模板中看到这一点.从Hero template：

[...]
<script src="/../assets/js/jquery.js"></script>
<script src="/../assets/js/bootstrap-transition.js"></script>
<script src="/../assets/js/bootstrap-alert.js"></script>
[...]