Javascript正在突出顯示主頁中的所有菜單項

我使用javascript突出顯示了我的菜單項，但它突出顯示了我在主頁中的所有菜單項，其餘頁面都正常工作。Javascript正在突出顯示主頁中的所有菜單項

我的javascript：

$(function() { 
    var url = window.location.href.substr(window.location.href.lastIndexOf("/") + 1); 
    $('[href$="' + url + '"]').parent().addClass("current_page_item"); 
});

我的主菜單：

<div id="menu" class="container"> 
    <ul> 
     <li class="current_page_item"><a href="Home.aspx" accesskey="1" title="">Home</a></li> 
     <li><a href="Softcare/SoftcareHome.aspx" accesskey="2" title="">Softcare</a></li> 
     <li><a href="Softlearn/SoftlearnHome.aspx" accesskey="2" title="">Softlearn</a></li> 
     <li><a href="Software/SoftwareHome.aspx" accesskey="2" title="">Software</a></li> 
    </ul> 
</div>

我這邊菜單：

<div id="sidemenu"> 
    <div class="section-title"> 
     <asp:ContentPlaceHolder ID="submenutitle" runat="server"> 
     </asp:ContentPlaceHolder> 
    </div> 
    <ul> 
     <li><a href="Home.aspx" accesskey="1" title="">Home</a></li> 
    </ul>  
</div>

再一次，只有我的主頁遇到這個問題，我在想這是因爲主頁的父母是〜/，這就是爲什麼它將current_page_item類添加到所有菜單項，包括子菜單項。所以我認爲這是我的JavaScript在我的主頁上無法正常工作。

PS。我試圖從javascript中刪除父（），它並沒有幫助

在此先感謝。

來源

2013-08-31 Mindless

你可以使用什麼樣的一個小黑客就像這樣：

$(function() { 
    var url = '/' + window.location.href.substr(window.location.href.lastIndexOf("/") + 1); 
    $('[href$="' + url + '"]').parent().addClass("current_page_item"); 
});

，並確保所有網址的開頭/：

<div id="menu" class="container"> 
    <ul> 
     <li class="current_page_item"><a href="/Home.aspx" accesskey="1" title="">Home</a></li> 
     <li><a href="/Softcare/SoftcareHome.aspx" accesskey="2" title="">Softcare</a></li> 
     <li><a href="/Softlearn/SoftlearnHome.aspx" accesskey="2" title="">Softlearn</a></li> 
     <li><a href="/Software/SoftwareHome.aspx" accesskey="2" title="">Software</a></li> 
    </ul> 
</div>

來源

2013-08-31 17:08:27 OneOfOne

謝謝，我嘗試了你的建議，但它不再突出顯示，並且我的html中的current_page_item存在，因爲無論用戶選擇哪個子菜單項，當前頁面都將在主菜單中保持突出顯示，因此用戶知道他在哪裏。 – Mindless

嘗試'console.log（url）'查看它打印的內容。 – OneOfOne

它正在打印Home.aspx – Mindless

您正在使用的選擇器是有點問題。在主頁上它是

$('[href$=""]')

我的意思是，如果你不打開你的網站Home.aspx末。只是域名。

這意味着*獲取所有元素與href結束爲空字符串。我想這會抓住每一個環節。

如果添加

if(url == "") { 
    $("#menu li").removeClass("current_page_item"); 
}

來源

2013-08-31 16:59:09 Krasimir

謝謝，但它仍然不能正常工作 – Mindless

如果您在主頁上使用console.log這個url，那麼w帽子是結果？ – Krasimir

它正在打印Home.aspx – Mindless

Javascript正在突出顯示主頁中的所有菜單項

回答

相關問題