javascript - 在 div 上应用 onclick 规则，但有异常(exception)

Question

我想每次用户单击页面上的任何位置(div“maincontent”)时运行一个javascript函数，除了两个按钮(div“btnNew”和“btnRegister”)中的任何一个。我怎样才能做到这一点？我的第一种方法不起作用。

<div id="mainContent" class="content" onclick="hidePopUps(document.this)">
    [...]
    <div id="btnNew" class="btn-welcome" onclick="showRegister()">New user</div>
    <div id="btnRegister" class="btn-welcome" onclick="showLogin()">Existing user</div>
    [...]
</div>

function hidePopUps(element) {
    if(element == $("#mainContent")) {
       hideLogin();
       hideRegister();
    }
}

Answer 1

您可以使用 jQuery 和 :not() 选择器来完成此操作:

$(":not(body):not(html):not(#btnNew):not(#btnRegister)").click(function() {
    // the :not(body) and :not(html) are to prevent it
    // from setting off additional event listeners because
    // everything is on top of the html and body tags

    // ... handler here
});

这应该选择除这两个按钮之外的所有内容。

查看工作示例 JSFiddle.net .