Question

我正在尝试创建一个jQuery单击函数，当您单击该div之外的任何内容时将关闭div。我的问题是，如果你点击它们，那里面有一个搜索字段和另一个按钮需要保持打开状态。

我目前的职能是：

$("*:not(#header)").click(function() {
    $('#header').slideUp({
        duration: 550, 
        easing: 'easeOutExpo'
    });
});

我还想说“并且不是'#categoryMore'并且不是'#headerSearch'”但是我一直在使用的语法没有用。

$("*:not(#header, #categoryMore, #headerSearch)")

和

$("*:not(#header), *:not(#categoryMore), *:not(#headerSearch)")

有什么想法吗？非常感谢你的帮助！

Answer 1

编辑：

以下是您可以测试的示例。 http://jsfiddle.net/yvFcz/

我使用slideToggle()作为示例，因此您可以更轻松地多次测试它。

在关闭document的{{1}}上设置处理程序。

然后在执行#header的{{1}}上放置一个处理程序，以防止事件在您单击文档时冒泡到文档中。

#header

http://api.jquery.com/event.stopPropagation

请注意，如果页面上的任何其他元素都有一个使用event.stopPropagation()或$(document).click(function() { $('#header:visible').slideUp({ duration: 550, easing: 'easeOutExpo' }); }); $('#header').click(function( event ) { event.stopPropagation(); });的点击处理程序，则该事件不会冒泡到文档，而您的event.stopPropagation()赢了“关闭。

在这种情况下，您需要直接在该处理程序中处理它。

Answer 2

您可能想要使用jQuery插件jQuery outside events：

使用jQuery外部事件即可绑定到将要发生的事件仅在具体时触发 “发源”事件发生在外面有问题的元素。例如，你可以点击外面，双击外面，鼠标外面，焦点外面（超过十个默认值 “外部”事件）。另外，如果是外面的话默认情况下未提供事件，你可以轻松定义自己的。

Answer 3

我认为您可以使用jQuery not()，它可能就像这样简单：

$(document).not('#header, #categoryMore, #headerSearch').click(function() {
    $('#header').slideToggle({
        duration: 550, 
        easing: 'easeOutExpo'
    });
});

这允许您点击#header之外的任何位置，系统会触发操作。您不必担心其他.click()事件及其传播（至少不是我所知）......它不会选择#header, #categoryMore,和#headerSearch。

只要您点击标题及其内容，就可以使用jQuery slideToggle()向上和向下滑动标题及其内容。如果您只想隐藏它，那么就像现在一样使用.slideUp()：）

希望有所帮助。

jQuery选择器：不是这个div而不是那个div

3 个答案: