Question

我有四个同一类的div。每个Div都有一个单独的ID，1,2,3,4。我想使用jQuery隐藏我的'div id 1'，如果任何其他div是可见的，反之亦然，所以如果'Div Id 4'可见，那么所有其他div将被隐藏。

我是jQuery的新手，所以我想了解如何做到这一点。如果有人能告诉我如何能够做到这一点，我将不胜感激。

$(document).ready(function() {
  if  ($("#tracker2").is(":visible")) {
    $("#tracker1").hide();
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="stages" id="1">Supplier Contacted</div>
<div class="stages" id="2">Supplier Registered</div>
<div class="stages" id="3">Audit Complete</div>
<div class="stages" id="4">Decision Made</div>

Answer 1

这将隐藏您的所有阶段，因为它将匹配具有类.stages

的所有元素

$('.stages').hide();

然后，这将显示ID为2的舞台：

$('#stage-2').show();

您需要更改您的ID，以便它们以文字作为前缀，因为如果ID只是数字，则ID无法在所有情境中使用。所以你的HTML应该是：

<div class="stages" id="stage-1">Supplier Contacted</div>
<div class="stages" id="stage-2">Supplier Registered</div>
<div class="stages" id="stage-3">Audit Complete</div>
<div class="stages" id="stage-4">Decision Made</div>

您还需要获取所点击项目的ID，我假设您已经在这个阶段进行了此操作。你会发现，一旦你进入你的单击处理程序，你可以使用this关键字来引用刚刚点击的东西，所以：

$(this).show();

应该足够了。事实上，这是更好的，因为您现在可以从HTML中完全删除ID，除非您需要其他内容

我的fiddle here shows this - 虽然我也用css中的不透明度设置替换了show和hide，所以隐藏的元素实际上仍然是可点击的！

当其他div可见时，jQuery隐藏div的id？

1 个答案: