Question

Bootstrap Warnings Image我有两种不同类型的bootstraps警报（警告和危险）。无论如何，总是假设危险警报在页面上。当用户单击下拉列表载体时会发出警告警报，它会显示引导警告通知。用户必须单击“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

正如马丁建议的那样，你需要在javascript中做些什么。我还没有测试过这个，但它会是这样的：

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

基本上，单击页面上的任何位置都会隐藏任何显示的警报。

Answer 2

由于您有两种不同类型的bootstraps警报（危险和警告）。你必须使用“.alert-warning”，因为当用户在页面的任何地方点击鼠标时，你想要摆脱它。 “.alert”是所有bootstraps警报，但是，如果你需要摆脱某种类型，你可以调用上下文类（例如，.alert-success，.alert-info，.alert-warning和/或.alert-danger。https://v4-alpha.getbootstrap.com/components/alerts/

1/3 PDOException in PDOConnection.php line 43:
SQLSTATE[HY000] [2002] Permission denied
1. in PDOConnection.php line 43
2. at PDO->__construct('mysql:host=correct_host;port=3306;dbname=correct_db', 'correct_username', 'correct_password', array('0', '2', '0', false, false)) in PDOConnection.php line 43

Answer 3

$(document).ready(function () { 
     $("#myWarning").click(function () {  
         $(".alert").alert("close"); 
     }); 
 });

通过这样做，你做错了两件事：

您可以将click事件绑定到元素页面加载时不存在。
您正在绑定点击事件受限制的元素。这意味着警报不会当您点击页面上的任何地方时关闭。在这种情况下，只需点击#myWarning即可关闭提醒。

最后，您应该使用@Bryan已发布的内容：）

编辑：

假设您有一组总是希望在页面加载时关闭的警报，请添加一个识别它们的方法，例如一个类＆＃34; close-on-screenclick＆＃34;

$(document).click(function () { 
     $(".close-on-screenclick.alert").alert("close");  
 });

。每当在屏幕上点击时，这应该关闭这些元素

单击页面上的任意位置时关闭引导警告

3 个答案: