列表項無法保留類

我在ASP.NET中使用jQuery代碼來更改列表項的類時單擊它。代碼工作正常，但問題是<li>更改了一段時間的類，但它代碼完全加載時無法保留。我的代碼是這樣的：列表項無法保留類

的jQuery：

$(document).ready(function() { 
    //On Click Event 
    $("ul.tabs li").click(function() { 
     $("ul.tabs li").removeClass("active"); //Remove any "active" class 
     $(this).addClass("active"); //Add "active" class to selected tab 
    }); 
});

HTML：

<div class="menu_nav"> 
    <ul class="tabs"> 
     <li><a href="default.aspx"><span>Home Page</span></a></li> 
     <li><a href="support.aspx"><span>Support</span></a></li> 
     <li><a href="aboutus.aspx"><span>About Us</span></a></li> 
     <li><a href="services.aspx"><span>Services</span></a></li> 
     <li><a href="contactus.aspx"><span>Contact Us</span></a></li> 
    </ul> 
</div>

來源

2012-12-17 Mubashir Gul

'li改變了一小會兒，當代碼完全加載時不能保留'你是什麼意思？ –

if im not wrong then then $（「ul.tabs li」）。removeClass（「active」）;只是從第一個LI中刪除類不是全部？ – Ladineko

你是否認爲它可以工作一段時間然後停止？ –

你的代碼是正確的，看到這裏jsfiddle.net/S3hGq/

但點擊後，您的瀏覽器加載網址，導致它是一個鏈接。重新加載後，'積極'級當然不再設置。

這是什麼情況？給我一些更多的信息來幫助你...

來源

2012-12-17 13:57:18 algorhythm

是的同樣的事情發生algorhythm ....你點的 –

是你的項目的一個PHP項目？你有PHP設置活動類到加載網站的鏈接？否則，如果只有javascript可以描述你的解決方案，就像@ShadowWizard一樣。與window.location.href的東西，並找到類似於加載頁面的鏈接，並設置活動。 – algorhythm

錯誤的方法。您需要「記住」單擊的最後一個錨點（例如，基於ID）或讀取當前文檔位置，並基於該位置突出顯示適當的項目。

我會給代碼第二種方法：

$(document).ready(function() { 
    //read current page: 
    var page = document.location.href.split("/").splice(-1,1); 

    //find proper item and mark it active: 
    $("ul.tabs li a[href='" + page + "']").addClass("active"); 
});

來源

2012-12-17 14:03:19

你必須給一個ID的所有li標籤。同樣作爲其鏈接例如Li與鏈接dashboard.aspx應該有儀表盤的ID，也dashboard.aspx應該有標題的儀表板，然後編寫代碼的頁面標題：

<script language="javascript" type="text/javascript"> 
    window.onload = function changeClass() { 
     document.getElementById(document.title).setAttribute("class", "current"); 
    } 
</script>

在這裏，在這個代碼中，我通過id找到頁面的標題，然後將類設置爲鏈接的li

來源

2012-12-20 09:17:42

對於java來說，像Struts 2和Spring MVC這樣的一些框架說我之前分享的JavaScript是obslete，所以我想出了新版本的相同在jQuery中的功能。

<script type="text/javascript"> 
      $(document).ready(function(){ 
      var testtitle=$('title').text(); 
      $("#"+testtitle).addClass('current'); 
      }); 
    </script>

來源

2013-09-11 06:54:53 user2767587

列表項無法保留類

回答

相關問題