bootstrap-alert

发表于 2018-05-16 分类于前端阅读次数：本文字数： 1.2k 阅读时长 ≈ 1 分钟

用来显示提示信息的，如果带有 data-dismiss=”alert” 那么关闭后就没了，无法再次打开。
下面是实际使用的例子。默认是隐藏的，需要的地方使用js设置消息并显示出来，

<div class="alert alert-danger alert-message" id="alertMsg" style="display:none;" role="alert">
    information here.
    <a class="close" href="#">×</a>
</div>

//js 处理
$('#alertMsg').html("<strong>警告！</strong>两次密码输入不一致" + '<a class="close" onclick="$(this).parent().hide();"  href="#">×</a>');
$('#alertMsg').show();

自动关闭

function showAlert(msg, isSuccess) {
    if (isSuccess) {
        $('#alertMsg').removeClass("alert-danger");
        $('#alertMsg').addClass("alert-success");
    } else {
        $('#alertMsg').removeClass("alert-success");
        $('#alertMsg').addClass("alert-danger");
    }
    $('#alertMsg').html(msg + '<a class="close" onclick="$(this).parent().hide();"  href="#">×</a>');
    // $('#alertMsg').show();
    $("#alertMsg").fadeTo(2000, 500).slideUp(500, function () {
        $("#alertMsg").slideUp(500);
    });
}