javascript - 如何隐藏某些 child ()。一个 parent ()。分区？

Question

我只想在用户点击我制作的选择菜单时显示div.card1

<table id="flowerTheme">
  <tr>
    <td>
      <div class="card1">
         <div class="guess"><a href="#" id="flower1" class="quickFlipCta"><img src="Test Pictures/QuestionMark.gif" /></a></div>
         <div class="remember"><a href="#" class="quickFlipCta"><img src="Test Pictures/flower.gif" /></a></div>
      </div>
    </td>
    <td>
      <div class="card2">
         <div class="guess"><a href="#" id="flower1" class="quickFlipCta"><img src="Test Pictures/QuestionMark.gif" /></a></div>
         <div class="remember"><a href="#" class="quickFlipCta"><img src="Test Pictures/flower.gif" /></a></div>
      </div>
    </td>
  </tr>
</table>

我有一个功能，可以在用户单击图像时切换“已选择”类。以下完美运行:

if($('.flowerThemePic').hasClass('selected') && $('.sixCardLayout').hasClass('selected')) {
    $('#flowerTheme').css('display', 'inline');

但是，正如我之前所说，我希望不显示 card2。我试过:

if($('.flowerThemePic').hasClass('selected') && $('.sixCardLayout').hasClass('selected')) {
        $('#flowerTheme').not('.card2').css('display', 'inline')

但这并没有做任何事情。我也试过:

if($('.flowerThemePic').hasClass('selected') && $('.sixCardLayout').hasClass('selected')) {
        $('#flowerTheme').find('div').not('.card2').css('display', 'inline')

但这隐藏了两张牌。显示 card1 而不是 card2 的正确方法是什么？

Answer 1

$('#flowerTheme').css('display', 'inline');
$('.card2').hide();