在ul和li标签中添加和删除类时遇到问题

Question

我正在使用Jquery开发一个应用程序，我想有条件地添加类和删除类。 在下面的代码中有菜单和子菜单。

如果用户单击#two或#three （打开子菜单）时，子菜单类被添加到ul含有标签#two和#three和菜单类被去除。

如果用户单击#three或#four （上li标签），菜单类被添加到ul含有标签#three和#four和子菜单类是从移除ul含有#one和#two

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function() { if (!$(".left_pannel ul li ul").hasClass('submenu')) { alert("test"); $(".left_pannel ul li").removeClass("iconadd"); } else { $(".left_pannel ul li").addClass("iconadd"); } }); </script> <body> <div class="left_pannel"> <ul> <li><a href="#one" class="achore">Matches</a> <ul id="one" class="submenu" style="display: none;"> <li><a href="https://www.google.com">Add Matches(m)</a></li> <li><a href="https://www.google.com">Add Cricket(m)</a></li> </ul> </li> <li><a href="#two" class="achore">Quize Master</a> <ul id="two" class="submenu" style="display: none;"> <li><a href="">Add Matches(m)</a></li> <li><a href="">Add Cricket(m)</a></li> </ul> </li> <li id="#three"><a href="https://www.google.com">Excel Update</a></li> <li id="#four"><a href="#">Application version</a></li> </ul> </div> </body>

Answer 1

在单击按钮上找到属于subMenu的类，如果存在该类， 则更改为iconadd的类，否则不删除iconadd

   $(document).ready(function()
   {
      $(".left_pannel ul li ul").on("click",function()
      {
        if ($(this).hasClass('submenu')) 
        {      
          $(".left_pannel ul li").addClass("iconadd");
        } 
        else 
        {
          $(".left_pannel ul li").removeClass("iconadd");
        }
      });
    });

谢谢，

Answer 2

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function(){ $(".left_pannel ul li ul").click(function(){ if ($(this).hasClass('submenu')) { $(".left_pannel ul li").addClass("iconadd"); } else { $(".left_pannel ul li").removeClass("iconadd"); } }); }); </script> <body> <div class="left_pannel"> <ul> <li><a href="#one" class="achore">Matches</a> <ul id="one" class="submenu" style="display: none;"> <li><a href="https://www.google.com">Add Matches(m)</a></li> <li><a href="https://www.google.com">Add Cricket(m)</a></li> </ul> </li> <li><a href="#two" class="achore">Quize Master</a> <ul id="two" class="submenu" style="display: none;"> <li><a href="">Add Matches(m)</a></li> <li><a href="">Add Cricket(m)</a></li> </ul> </li> <li id="#three"><a href="https://www.google.com">Excel Update</a></li> <li id="#four"><a href="#">Application version</a></li> </ul> </div> </body>

试试这个代码

在ul和li标签中添加和删除类时遇到问题

问题描述

2 个解决方案

解决方案1
2

解决方案2
0 2019-06-13 13:42:59

在ul和li标签中添加和删除类时遇到问题

问题描述

2 个解决方案

解决方案1 2

解决方案2 0 2019-06-13 13:42:59

解决方案1
2

解决方案2
0 2019-06-13 13:42:59