Question

作为Javascript和jQuery的新手，我不确定这根本不可能，或者我只是做了一个完全愚蠢的错误：

我想在div本身以外的任何点击中隐藏div。

我已将代码简化为演示目的：

HTML

<html>
    <div class="tooltip">
        Bla Bla Bla
    </div>
</html>

的jQuery

$('html:not(.tooltip)').click(function() {

    $('.tooltip').hide();

});

演示

http://jsfiddle.net/yCx6F/1/

Answer 1

添加空格：

$('html :not(.tooltip)')

当您说html:not(...)时，您正在寻找与您的选择器不匹配的所有html元素。

添加空格会查找html元素的子元素，这就是您想要的。

看看这是否符合您的要求：http://jsfiddle.net/yCx6F/2/

实际上，你应该这样做：

$('.tooltip').click(function(e) {
  e.stopPropagation();
});

// Once the `<div>` is created, in the same function:

$(document).one(function() {
  $('.tooltip').hide();
});

Answer 2

我会做这样的事情：

$(document).click(function(ev) {
    if (!$(ev.target).is('.tooltip')) $('.tooltip').hide();
});

Answer 3

试试这个......

$('*:not(.tooltip)').click(function() {
    $('.tooltip').hide();
});

$('.tooltip').click(function(e) {
    e.stopPropagation();
});

Answer 4

你错过了一个空间。

$('html :not(.tooltip)').click(function() {

    $('.tooltip').hide();

});

$('html:not(.tooltip)').click(function() {

表示任何不是.tooltip

的HTML元素

$('html :not(.tooltip)').click(function() {

表示HTML中不是.tooltip

的任何元素

<强> Example here

jQuery + Not Selector

4 个答案: