检查div上是否显示元素

Question

<div id="ris" class="alert alert-info">
    <div id="one">
        <p>.....</p>
    </div>
    <section id="toggle" class="toggle>
        <label</label> 
        <div id="" class="toggle-content">
            <ul>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
        </div>
    </section>
</div>

if ($('section').css('display') == 'none') {
    $("#one").show();
}
else {
    $("#one").hide();
}

选择器:visible不起作用，我尝试使用CSS display，没有。我想知道当该部分不可见时是否可以显示div #one。在我的实际代码中，还有更多部分。

Answer 1

这应该有所帮助：$('section').is(':visible')

if ($('section').is(':visible')) {
  $("#one").show();
} else {
  $("#one").hide();
}

section {
  display: block;
  /* display: none; */
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div id="ris" class="alert alert-info">
  <div id="one">
    <p>.....</p>
  </div>
  <section id="toggle" class="toggle>
  <label></label> 
  <div id=" "class="toggle-content ">
  <ul>
    <li>  </li>
    <li>  </li>
    <li>  </li>
    <li>  </li>
    <li>  </li>
    <li>  </li>
    <li>  </li>
  </ul>
</div>
</section>
</div>