jQuery的孩子是捕捉点击，只希望父母

<div id="outer"> 
<div id="inner"> 
</div> 
</div>

外div的尺寸是500×500，和内为100×100。我试图使用下列内容：

$('#outer').click(function() { 
    $('#outer').fadeOut(); 
});

但是，当你点击100x100的面积#inner，它仍然淡出。如何防止这一点？

2010-11-04 steve

你的意思是孩子获取点击，你只想要父母 – colinmarc 2010-11-04 04:22:29

啊，是的，我误打了。对于下面的两个人，我已经修改了标题。我想让外部div抓住点击，但内部忽略。如果用户点击100x100'＃inner'，我希望它保持打开状态，但如果您在其外部点击，则需要淡出。 – steve 2010-11-04 04:52:44

最好不要为内部元素分配点击处理程序。在点击功能检查事件目标等于外部。像

$('#outer').click(function(e) { 
    if (e.target.id === "outer"){ 
     $('#outer').fadeOut(); 
    } 
});

2010-11-04 05:39:16 rahul

这工作出色，是更清洁的国际海事组织。谢谢。 – steve 2010-11-04 05:53:55

@Rahul完美！ – Steffi 2012-06-13 08:15:38

捕获点击内部DIV和起泡停止：

$('#inner').click(function(ev) { 
    ev.stopPropagation(); 
});

这是除了你上面的“外”点击处理程序。

2010-11-04 04:24:31

我需要'＃外部'来捕捉点击，而内部不需要。内部div将在其内部有链接，所以需要在不关闭的情况下点击它们。一旦'＃outer'被点击，它应该关闭。 – steve 2010-11-04 04:56:07

给我们每一步，你想要做..可以帮助我们。 – klox 2010-11-04 05:10:48

啊，我重新申请了上面的代码，这次它工作。上次必须错误输入内容。感谢大家。 – steve 2010-11-04 05:31:39

东西，我想通了，这个代码工作得更好，而不是依赖于知道该元素的ID或类：

$('#outer').click(function(e) { 
    if (e.target === this){ 
     $('#outer').fadeOut(); 
    } 
});

2010-11-20 15:28:42 Cristian

你甚至可以进一步做'$（this）.fadeOut（）;' – 2013-09-13 16:35:23

回答