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

Question

我有以下html

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

Parent 是 100% 宽度，顶部和底部有填充，Window 居中，宽度为 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
    }
});

演示

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
});