私信  •  关注

WebDirection

WebDirection 最近创建的主题
WebDirection 最近回复了
5 年前
回复了 WebDirection 创建的主题 » jquery样式未应用于其元素

你可以试试这个

$('ul li a').click(function (){
   $("ul li > a").removeClass("active");
   $(this).addClass("active");
   if($(this).next('.dropdown-list').length != 0){
        $(this).next('.dropdown-list').slideToggle();
   }
});
.dropdown-list {
        display: none;
 }
.active {
  color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<nav>
   <div class="logo">LOGO</div> 
     <ul>
       <li><a href="#" class="active">Home</a></li>
       <li><a id="d1" href="#">Projects</a>
           <ul class="dropdown-list">                    
                  <li><a style="line-height: 0;" href="#">Pictures</a></li>
                    <li><a style="line-height: 0;" href="#">Movies</a></li>
                    <li><a style="line-height: 0;" href="#">Slow-mo</a></li>
           </ul>
       </li>
       <li><a id="d2" href="#">About me</a>
           <ul class="dropdown-list">                    
                        <li><a style="line-height: 0;" href="#">CV</a></li>
                        <li><a style="line-height: 0;" href="#">Phone</a></li>
           </ul>
       </li>
       <li><a href="#">Contact</a></li>
     </ul>
  </nav>