.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"); 
       } 
      }); 
     }