当孩子可见时如何将课程添加到父课程?

时间:2018-03-01 11:46:07

标签: javascript jquery html dom

我有一个带子菜单的菜单,当子菜单可见时我想将一个类添加到父列表元素。



<ul class="upper-menu">
  <li>Item 1</li>
  <li>Item 2</li>
  <li class="parent-li">Item 3
    <ul class="lower-menu">
      <li>Sub Item 1</li>
      <li>Sub Item 2</li>
    </ul>
  </li>
  <li>Item 4</li>
</ul>
&#13;
&#13;
&#13;

基本上,当&#34;下菜单&#34;是可见的,我想在list元素中添加另一个类&#34; parent-li&#34;。此外,当下方菜单不可见时,我想从&#34; parent-li&#34;中删除该课程。这可能在JQuery中吗?

由于

2 个答案:

答案 0 :(得分:0)

您可以按:visible伪类选择所需的元素,然后将您的类分配给其父级:

&#13;
&#13;
$(".lower-menu:visible").closest('.parent-li').addClass("test");
&#13;
.test {
  background-color: yellow;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="upper-menu">
  <li>Item 1</li>
  <li>Item 2</li>
  <li class="parent-li">Item 3
    <ul class="lower-menu">
      <li>Sub Item 1</li>
      <li>Sub Item 2</li>
    </ul>
  </li>
  <li>Item 4</li>
</ul>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

您可以按照以下jquery脚本

进行操作
if($('.lower-menu').is(':visible')){
    $(this).parent().addClass("YourClass");
 }