不能 select 除一个元素外的所有元素

Question

我正在尝试 select 一个页面的所有元素，除了一个，在一个函数中：

$('#sidebutton').click(function () {

if (!$('.sidemenu').hasClass("current")) {
    prevScrolPos = $(window).scrollTop();
    scrollTo = 0;
} else {
    scrollTo = prevScrolPos;
}

$('.hidelem').toggleClass("hidden");
$('.sidemenu').toggleClass("current"); 
$('html,body').scrollTop(scrollTo);
});

当我使用简单的 class select 或 (.hidelem) 时它有效，但当我使用更复杂的东西（例如 $("*:not(.sidemenu)").toggleClass("hidden"); 或$("*").not(".sidemenu").toggleClass("hidden"););这些只会导致一片空白 window。

你能告诉我我在这里遗漏了什么吗？

JSFiddle：https://jsfiddle.net/et978wjw/5/（缺少全部功能，但我希望你能理解）

Answer 1

问题是您可能跳过 .sideMenu 和 $("body *:not(.sidemenu)")，但您没有跳过它的父级 DIV。如果你隐藏了一个祖先，你也隐藏了它的所有后代。您也没有跳过任何后代，因此 .sidemenu 的子代也被隐藏了

因此，您需要排除任何属于 :not:(has()) 的 .sidemenu 祖先的任何内容，然后排除 sidemenu 本身，然后排除 sidemenu 的所有子项：

$("#container :not(:has(.sidemenu)):not(.sidemenu):not('.sidemenu *')").toggleClass("hidden");

JSFiddle: https://jsfiddle.net/TrueBlueAussie/et978wjw/8/

您确实应该将 hide/show 指向更具体的内容。也许一个包装 div 围绕着你想要隐藏的一切？我为演示添加了一个。

说了这么多，你的选择过程相当复杂。你最好简单地添加一个 class 到你想要切换的所有东西而不是只切换那些（你已经在 div 上有 nodisplay，所以我现在使用它).

例如就是这样：

$(".nodisplay").toggleClass("hidden");

JSFiddle: https://jsfiddle.net/TrueBlueAussie/et978wjw/9/

不能 select 除一个元素外的所有元素

Cannot select all elements except one

javascript

jquery

jquery-selectors