如何确定页面某一部分中的jquery单击是否与元素相关？

Question

我有以下jQuery事件处理程序：

$('html').click(function(event) {
    if ( ! $(".ronstoppable").find($(event.target))){
        if ($('.dropdown').is(':visible')){
            $('.dropdown').hide();
        }
    }
});

这将检查，当我单击页面上任何位置时，如果实际点是特定元素的子元素，则不执行任何操作。

这是因为我有一个弹出--如果用户在弹出窗口外单击，弹出窗口就会消失。如果他们在里面点击，我不想让弹出式弹出消失。

然而，这段代码不起作用--当他们点击弹出窗口(yay)时什么都不会发生，但是同样的和可悲的是，当他们点击弹出(boo)之外时什么也不会发生。

如何解决这个问题，这样当用户单击外部时弹出窗口就会消失？

请不要使用stopPropagation()或任何东西，我使用的是jQuery手机，当任何东西都不传播时，它会让超级不高兴。

Answer 1

因为.find()返回一个始终都是真实的jQuery对象.所以如果条件永远不会被执行..。

我认为您可以尝试使用.closest()来查看.ronstoppable是否是目标元素的祖先。

$('html').click(function (event) {
    if ($(event.target).closest(".ronstoppable").length) {
        if ($('.dropdown').is(':visible')) {
            $('.dropdown').hide();
        }
    }
});

Answer 2

因为您正在检查子级，所以可以使用find()对它们进行计数，以检查是否找到了：

if ( $(".ronstoppable").find($(event.target)).length != 0){
    //your awesome code goes here
} else {
    //boo
}