Question

我需要一些JAVASCRIPT / CSS / HTML的帮助。我为表单创建了一个小对话框，如下所示：

#greyout{
background-image:url('../res/greyout.png');
display:none;
width:100%;
height:100%;
position:absolute;
left:0;
top:0;
z-index:10;
}
.forms{

width:20%;
position:absolute;
top:20%;
left:40%;
right:40%;
display:none;
height:30%;
border: 1px solid black;
background-color:white;
color:black;
text-align:center;
}

表单div在HTML中的greyout div中。此外，我有一个触发此功能的按钮：

function login()
{
    document.getElementById("greyout").style.display="block";
    document.getElementById("loginForm").style.display="block";
}
function signup()
{
    document.getElementById("greyout").style.display="block";
    document.getElementById("signupForm").style.display="block";
}

我想确保当我按下灰色的背景时，对话框会分类＆＃34;形式＆＃34;将消失，因为页面的灰色。尝试为greyout div创建一个onclick事件，即使在对话框本身上也会如此紧迫，它会触发。我只需要在用户在后台按下时才需要收听。提前谢谢。

Answer 1

当事件冒泡DOM树时，可以预料到这一点。尝试在外部和内部div上听取onclick，如果单击内部div，则返回false以取消事件冒泡并保持外部div的当前侦听器。

Onclick位置细节

1 个答案: