Javascript Onclick位置详细信息

我需要一些关于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";
}

---

我想确保当我按下灰显的背景时，对话框分类的表单会消失，页面也会灰显。尝试为greyout div创建onclick事件时，即使在对话框本身上按下该按钮，也会触发。只有当用户在后台按下按钮时，我才需要听。提前感谢。

这是意料之中的事情，因为事件会在DOM树上冒泡。尝试在外部和内部div上侦听onclick，如果单击了内部div，只需返回false即可取消冒泡事件并保持外部div的当前侦听器。

使用onclick=signup；onclick=login；在div/按钮/标签上需要它们的位置@user3312767@user3312767我想你不明白。我可以让它出现我只是不能让它消失。我想在灰显的背景上按一下，它会恢复正常，但当我按对话框本身时就不会了。@user3312767我仍然无法做到这一点：我尝试过这样做：。介意详细说明一下我们如何在不使用jquery的情况下使用一个示例来实现这一点吗？我让它工作起来了，但这并不好。我希望它能说明onclick的两个侦听器都会被调用。出于某种原因，return false并没有起到作用，但我认为更优雅的方法是通过JS而不是html附加事件，并正确地取消它。我还没有找到这方面的工作示例。我自己可能想问个问题。