jquery - Jquery，具有两个类的 div 隐藏一个显示另一个 - 冲突？

Question

抱歉，如果在上一个帖子中回答了这个问题，我找不到。

我有 4 个部分：Section1、Section2、Section3、Section4

每个部分都有类，所以我根据部分隐藏和显示。问题是某些类需要在第 1 节和第 2 节中显示。

<div class="section1 section2">
blah blah
</div>

$('a.homeLink').click(function(){
  $('.section1').show();
  $('.section2, .section3, .section4').hide();
  return false;
});

正如您在这种情况下看到的那样，我在两个部分中有一个 div，但正如我认为会发生的那样，由于隐藏类 section2，它仍然隐藏

变通方法或解决方案？

谢谢

Answer 1

好吧，如果section1总是优先于section2，只需更改调用的顺序：

$('.section2, .section3, .section4').hide();
$('.section1').show();

如果不是那么简单，您需要告诉我们更多有关要求的信息。

Answer 2

我建议重新考虑您的 CSS 架构....或重新排序您的 JavaScript 事件。CSS 和脚本事件都有一个自然的级联，需要在您的架构中进行考虑。你越是与这种自然级联作斗争，你的 CSS 和 JavaScript 就会越混乱。

Answer 3

您可以添加一个通用部分类，然后过滤“实例类”（例如 section1）：

<div class="section section1 section2">
blah blah
</div>

<div class="section section3 section4">
blah blah
</div>

$('a.homeLink').click(function(){
  var sections = $('.section');
  $('section1', sections).show();
  sections.not('.section1').hide();
  return false;
});