.slideUp（）jQuery命令没有执行

Question

我想隐藏每个导航链接，但第一个在我的导航栏中。尽管如此，slideUp()函数并没有隐藏它们。我有一个循环，应该检查导航链接是否具有“第一”类。如果它具有“第一”类，则链接保持在那里。如果导航链接没有“第一个”类，则应该使用滑动动画来隐藏它;但事实并非如此。

这是我的html：

<nav> 
    <ul id='nav'> 
     <li><a href="index.php"><icon><img src="images/home-icon.png"></icon>Home</a></li> 
     <li><a href="skillsets.php"><icon><img src="images/skills-icon.png"></icon>Skillsets</a></li> 
     <li><a href="gallery.php"><icon><img src="images/gallery-icon.png"></icon>Gallery</a></li> 
     <li><a href="about.php"><icon><img src="images/about-icon.png"></icon>About</a></li> 
     <li><a href="contact.php"><icon><img src="images/contact-icon.png"></icon>Contact</a></li> 
    </ul> 
</nav> 

这是我的javascript：

var is_mobile = false, 
    page = document.location.pathname.match(/[^\/]+$/)[0]; 
$(document).ready(function(){ 
    var ul = $('nav > ul'), 
     li = ul.children('li'), 
     href = li.find('a[href*="'+page+'"]'), 
     is404 = true; 
    if($('#mobile').css('display')=='none') { 
     is_mobile = true;  
    } 
    if(is_mobile) { 
     orderList(); 
     prepareList(); 
    } 
    /************************************************************/ 
    /* Reorders the list relative to the page the user is on */ 
    /**********************************************************/ 
    function orderList() { 
     //move element to top 
     ul.prepend(href.parent()); 
     //set top elements class to "top" 
     $(href).attr("class", "top"); 
     if(page != ""){ 
      //loop through the nav elements 
      li.children('a').each(function(){ 
       //if the name of the page the user is on matches one of the nav links execute the command 
       if (page == $(this).attr('href')) { 
        is404 = false; 
       } 
      }); 
      if (is404) { 
       //if the user is on a page not in the nav, add a 404 link at the top of the nav 
       ul.prepend("<li><a href='404NotFound.php' class='top'><icon><img src='images/404-icon.png'></icon>404</a></li>"); 
      }else{ 
       //set top links' class to "top" 
       $(href).attr("class", "top"); 
      } 
     } 
    }; 
    /*****************************************************************/ 
    /* Prepares the list to be dynamically expandable/collapsible */ 
    /***************************************************************/ 
    function prepareList() { 
     //loop through the nav elements and differentiate the first nav link and the remaining nav links 
     li.children('a').each(function(){ 
      //check if the link has the class: "first" 
      if (first == $(this).attr('class')) {// attribute value matches variable value 
       //make the first nav link function as the button to open and close the nav 

      } else {// attribute doesn't exist, or its value doesn't match variable value 
       //hide the remaining nav links with a slideUp animation 
       $(this).slideUp("slow"); 
      } 
     }); 
    } 
}); 

任何想法的家伙？谢谢您的帮助！

Answer 1

你必须写 “第一次”，而不是第一个脚本..

写这样 如果（ “第一” == $（本）.attr（ '类'）） 而不是 如果（第一个== $（this）.attr（'class'））

它在你的情况下首先作为一个变量而不是字符串处理。

Answer 2

使用.hasClass方法，你可以检查类是存在还是不

只要改变你的prepareList功能

function prepareList() { 
      //loop through the nav elements and differentiate the first nav link and the remaining nav links 
      li.children('a').each(function(){ 
       //check if the link has the class: "first" 
       if($(this).hasClass("first")){ 

       } 
       else{ 
        $(this).slideUp("slow"); 
       } 
      }); 
     }