Question

下面，我已经粘贴了一个指向启用JQuery的网页的链接。查看源代码，您可以看到我使用了

$('html').not(this).fadeTo('fast', 0.25);

除了点击的DIV之外，尝试让整个屏幕褪色。不幸的是，每当我测试它时，我发现一切都已消失，包括在上面的命令中被认为未被选中的DIV。为什么会发生这种情况？我该如何解决？

非常感谢任何和所有帮助！

随意查看源代码： http://numberonekits.com/SchoolWeb/index.html CSS和其他JS文件位于同一目录中。

以下是相关代码：

<body>
//other stuff that should be faded...
<div id="templatemo_content_wrapper">
//other stuff that should be faded...
<div id="templatemo_sidebar">
//other stuff that should be faded...
<div id="announce">

<p>This is the DIV that shouldn't be faded</p>

</div>
//other stuff that should be faded...
</div>
//other stuff that should be faded...
</div>
//other stuff that should be faded...
</body>

Answer 1

只要this不是html元素，您就会淡化html元素，这将淡化其所有后代。

我没有看你的来源，但听起来你有一群兄弟姐妹。

如果是这样，您需要选择它们，然后对该选择进行.not(this)。

类似的东西：

var sections = $('.top_sections');

// then on some event
sections.click( function() {
    sections.not( this ).fadeTo('fast', 0.25);
});

从以下评论中发布备用解决方案：

由于您要突出显示的元素嵌套在您希望隐藏的其他后代的祖先中，您应该...

......采取不同的方法。使用图层。

有div覆盖整个页面的宽度和高度。我们称之为blocker。将其放在z-index:100或其他地方。设为background:#FFF和opacity:0。

然后，当您要突出显示announce部分时，请将其z-index设置为高于100（或高于z-index的{{1}}的内容），然后淡入blocker到blocker。

Answer 2

$('body').children().not('#templatemo_content_wrapper').add(
  $('#templatemo_content_wrapper').children().not(this)
).fadeTo('fast', 0.25);

可能会做到这一点。

JQuery .not（）选择不起作用

2 个答案: