javascript - 单击页面上的任意位置时关闭 Bootstrap 警告

Question

Bootstrap Warnings Image我有两种不同类型的 Bootstrap 警报(警告和危险)。无论如何，危险警报总是应该出现在页面上。当用户单击下拉列表运营商时会发生警告警报，它会显示 Bootstrap 警告通知。用户必须单击“x”才能关闭。当用户单击页面上的任意位置或单击“x”时，我需要它工作。

HomeController.cs

case "Carrier":
    var carrierid = (from foo in db.Carriers
                     where foo.ID == warningid
                     select foo.WarningID).Single();
    if (carrierid != null)
    {
        warning = (from warnings in db.Warnings
                   where warnings.IsActive == true && warnings.Id == carrierid
                   select warnings.WarningBody).SingleOrDefault();
        if (warning != null)
        {
            warning = ("<div class=\"alert alert-warning alert-dismissible\" id=\"myWarning\" role=\"alert\"><button type=\"button\" class=\"close\" data-dismiss=\"alert\" aria-label=\"Close\"><span aria-hidden=\"true\">&times;</span></button><strong>" +
            warning + "</strong></div>");
        }
        else
        {
            warning = "";
        }
    }
    else
    {
        warning = "";
    }
    return Json(warning, JsonRequestBehavior.AllowGet);
default:
    break;

warningwriter.js

           //// warning display script takes a value of warningid and warningcaller
            $(document).ready(function () {
                   var warningid = 0;
                   var warningcaller = "Universal";
                   loadWarnings(warningid, warningcaller);
             });
              $('#Phones').change(function () {
                   var warningid = $(this).val();
                   var warningcaller = "Phone";
                   loadWarnings(warningid, warningcaller);})
             $('#Carriers').change(function () {
                   var warningid = $(this).val();
                   var warningcaller = "Carrier";
                   loadWarnings(warningid, warningcaller);})
          function loadWarnings(warningid, warningcaller) {
$.getJSON("../Home/LoadWarnings", { warningID: warningid, warningCaller: warningcaller },
            function (warning) {
            var select = $('#warnings');
            select.append(warning);

    });    
}; 

Answer 1

正如 Martin 所建议的，这是您需要在 javascript 中执行的操作。我还没有测试过这个，但它会是这样的:

$(document).click(function (event) {            
   $(".alert").hide();
});

基本上，单击页面上的任意位置将隐藏所有显示的警报。