Question

Image when 'x' is not clicked on 我有一个包含引导警告警报的网站。当用户在下拉载体上选择运营商时，会出现警告框。当框出现时，用户必须点击“＆＃39; x＆＃39;如果用户没有点击＆＃39; x＆＃39;并选择另一个载体，就像在图像中一样出现另一个警告框。如果用户点击页面上的任意位置或用户点击“＆＃39;”，我会尝试让它消失。

HomeConroller.cs

   warning = ("<div class=\"alert alert-warning alert-dismissible\" role=\"alert\">
  <button type=\"button\" class=\"close\" data-dismiss=\"alert\" aria-label=\"Close\"><span aria-hidden=\"true\">&times;</span></button><strong>" +
   warning + "</strong></div>");

Index.cshtml //当用户点击页面上的任意位置并且通知消失时，需要有关此部分文件的帮助。

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

Answer 1

您应该在更改选择字段时关闭警报，而不是在有人点击内容

时关闭警报

或者，当用户选择新的运营商时，您可以检查是否没有打开的提醒，如果是，则添加新的提醒。

if($(".alert").length == 0) {
    //add new alert 
}

＆＃13;

$(function(){
  $("#carrier").change(function(){
     //Close all open alerts
     $(".alert").alert("close");
     //Add new alert here
  });
});

＆＃13;

<link data-require="bootstrap@3.3.7" data-semver="3.3.7" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
    <script data-require="jquery@2.2.4" data-semver="2.2.4" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    
    <script data-require="bootstrap@3.3.7" data-semver="3.3.7" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    
   
    <select id="carrier">
      <option value="verizon">Verizon</option>
      <option value="tmobile">TMobile</option>
      <option value="at&t">AT & T</option>
      <option value="sprint">Sprint</option>
    </select>

    <div class="alert alert-warning alert-dismissible" role="alert">
      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">×</span>
      </button>
      <strong>Warning!</strong>
 Better check yourself, you're not looking too good.
    </div>

＆＃13;

如何在鼠标单击时关闭引导警告警报？

1 个答案: