我有一个 javascript 可以打开一个隐藏的 div:
<script>
function dropdown()
{ document.getElementById("login_dropdown").style.display="block"; }
</script>
html是:
<div onclick="dropdown()">
<div id="login_dropdown">STUFF</div>
</div>
CSS是:
<style>
#login_dropdown {
width: 150px;
display:none;
}</style>
单独使用 javascript,当我点击页面上的任何其他地方时,我如何隐藏这个 div,不包括打开的 DIV 本身。
function closest(e, t){
return !e? false : e === t ? true : closest(e.parentNode, t);
}
container = document.getElementById("popup");
open = document.getElementById("open");
open.addEventListener("click", function(e) {
container.style.display = "block";
open.disabled = true;
e.stopPropagation();
});
document.body.addEventListener("click", function(e) {
if (!closest(e.target, container)) {
container.style.display = "none";
open.disabled = false;
}
});
#popup {
border: 1px solid #ccc;
padding: 5px;
display: none;
width: 200px;
}
<div id="container">
<button id="open">open</button>
<div id="popup">PopUp</div>
</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句