确定是否单击了某个元素？

Question

如何确定是否使用jQuery单击了一个元素？

类似$('.ele').is(':clicked');东西$('.ele').is(':clicked');

我坚持使用jQuery 1.7.2，而我想要做的是强制关闭一些模态元素，当单击文档中的任何位置并且其中一个已经打开时。

所以我有：

$('body').on('click', function () {
    if ($('.calc-info').is(':visible') && !$('.mi').is(':clicked')) {
        $('.calc-info').fadeOut('fast');
    }
});

但它会抛出一个错误，因为没有:clicked表达式

笔记

• .calc-info是模态
• .mi是点击打开所述模态的按钮

Answer 1

反过来说，检查点击的元素（event.target）是否与选择器匹配

$('body').on('click', function (event) {
    if ( $(event.target).is('.ele') ) {
        // do stuff
    }
});

在你的情况下，我会去

$('body').on('click', function (event) {
    if ( $('.calc-info').is(':visible') && 
         !($(event.target).closest('.mi').length)
       ) {
          $('.calc-info').fadeOut('fast');
    }
});

Answer 2

只需检查被点击的element是否具有要排除的class 。 它只是一种short circuit实现。 如果用户直接单击目标元素，以下代码将阻止不必要的dom traversal 。

尝试这个，

$('body').on('click', function (e) {
    if ($('.calc-info').is(':visible') 
    && !$(e.target).hasClass('mi') 
    && !$(e.target).parents('.mi').length) {

        $('.calc-info').fadeOut('fast');

    }
});

Answer 3

尝试这样的事情。

$('mi').on('click', function () {
$('mi').attr('rel',"clicked");
});
$('body').on('click', function () {
if ($('.calc-info').is(':visible') && !$('.mi').attr('rel')=='clicked') {
    $('.calc-info').fadeOut('fast');
}
});`