javascript - 单击div不起作用

我正在尝试使“弹出式” div在用户单击时消失。我的按钮上的这段代码可以正常工作：

$("#download-1").on("click", function () {
      $("#popupDiv").toggle("slow");
  });

问题是，您只能在单击按钮时使弹出div消失。我尝试使用以下代码段使div在您每次单击时都消失-但它不起作用。有人可以解释为什么吗？

if ($("#popupDiv").attr("display") == "block") {
      $(":not(#popupDiv)").click(function () {
          $("#popupDiv").toggle("slow");
      });
  }

HTML：

  <div class="button" id="download-1">
  <img src="Images/Download.svg" />
  </div>
  <div class="popupDiv" id="popupDiv">
      <div class="popup-levels"></div>
      </div>
   <div class="download-type-picker"></div>
 </div>

最佳答案

这是简单的解决方案。你可以试试。

$(document).mouseup(function (e){

  var container = $("#popupDiv");//your popupDiv id
  if (!container.is(e.target) && container.has(e.target).length === 0){
    container.hide();
  }

});

关于javascript - 单击div不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/42542303/