jquery，点击div内的任何地方，除了某个孩子

Question

我有以下html

<div id="parent">
   <div id="window"><!-- contents of window ---></div>
</div>

父级是100％宽度，填充顶部和底部，窗口居中，宽度为600px。

我需要弄清楚的是一个jquery选择器，当用户点击Parent内部但在Window外面的任何地方时，它会触发

Answer 1

检查目标是否为id parent

$('#parent').on('click', function (e) {
    if (e.target.id == "parent") {
        //code for clicking outside window but inside parent
    }
});

DEMO

Answer 2

您可以将点击处理程序绑定到#parent，然后阻止来自#window的点击传播。这允许您在#parent内部添加其他嵌套内容，而无需弄乱事件目标列表。

$("#window").on("click", function(e) {
    e.stopPropagation();
});
$("#parent").on("click", function(e) {
    // Do your thing
});

在此处查看演示：http://jsfiddle.net/4kGJX/

Answer 3

你可以这样试试

$('#parent').not("#window").on('click', function (e) {
    //do stuff
});