Question

如果有人单击一个对象，它就会相应地过滤所有对象（例如：所有项目，已完成的项目，因为我有一个jQuery来照顾这样，所以我正在制作菜单（我添加了{{1} }，在添加此脚本之前，此脚本可以正常工作）：

.not()

我发现我应该使用$("#completed").click(function(){ $('.project_wrapper[data-category="completed_projects"]').not(this).hide(); });来.not()所有没有给定.hide的对象，否则我做错了吗？

编辑

HTML：

菜单：

[data-category]

项目：

<ul class="project_menu>
 <li id="complete">Completed Projects</li>
</ul>

编辑感谢@Nitha和@Sam Hollenbach使其成功了！

我自己做了一点编辑，但这是我得到的最终jQuery代码：

<div class="project_wrapper" data-category="completed_projects">The projects</div>

更新

我没有使用jQuery(document).ready(function($){ // Show all $("#all").click(function(){ $(".project_wrapper").show(); }); // Complete $("#complete").click(function(){ $(".project_wrapper:not([data-category='completed_projects'])").hide(); $(".project_wrapper[data-category='completed_projects']").show(); }); });和.show，而是使用.hide和.css("visibility", "collapse")进行显示和隐藏，这似乎在WordPress中给我带来了麻烦。

Answer 1

下面的代码将隐藏所有data-category不等于“ completed_projects”的project_wrapper div，并显示data_category等于“ completed_projects”的project_wrapper div

$(".project_wrapper:not([data-category='completed_projects'])").hide();
$(".project_wrapper[data-category='completed_projects']").show();

Answer 2

我相信您要问的是隐藏.project_wrapper中除.project_wrapper[data-category="completed_projects"]元素之外的所有元素。在那种情况下，我相信你可以做到

$('.project_wrapper *').not('.project_wrapper[data-category="completed_projects"').hide();

或者如果您要删除body

中的所有内容

$('body *').not('.project_wrapper[data-category="completed_projects"').hide();

这将删除.project_wrapper或body中的所有元素，减去具有正确数据类别的元素，然后隐藏所有其他元素。

Source

用jQuery隐藏除给定data- *属性外的所有元素

2 个答案: