Question

我设法制作了一个脚本，允许我在点击链接时显示和隐藏我的div，但我也希望它在我点击div之外隐藏div ....我该如何管理这样的事情？

<script>
function toggle() {

var ele = document.getElementById("dropdown");

var text = document.getElementById("trigger");

if(ele.style.display == "block") {

        ele.style.display = "none";

    text.innerHTML = "Kontakta oss";

}

 else {

    ele.style.display = "block";

    text.innerHTML = "Kontakta oss";

}

 } 
    </script>

Answer 1

您需要收听文档的点击次数。

var ele = document.getElementById("dropdown");

document.addEventListener("click", function(event){ 
  var childClicked = [].slice.call(ele.getElementsByTagName('*')).some(function(node) {
    return node === event.target;
  });
  if(event.target !== ele && !childClicked){
      ele.style.display = "none";
  } 
});

我在这里使用文档，但您可以使用document.querySelector选择符合您需求的任何内容。

编辑：评论后

单击以显示div，再次单击以隐藏，或单击div外部以隐藏

1 个答案: