Изменение выбранного элемента элементов меню по страницам

Question

Для моего проекта веб-сайта я использую ASP.NET MVC «Razor». Изучаю, как я иду.

У меня есть 5 или 6 страниц на моем сайте и одна страница, которая находится на другом сайте. Я хочу, чтобы пользователи чувствовали, что используют один и тот же сайт для всех.

Существует типичное меню HTML для страниц, которые следуют стандартной схема с использованием маркированного списка XHTML и CSS для макета:

<ul id="menu"> 
    <li class="selected"><a href="@Href("~/")">Home</a></li> 
    <li><a href="http://ceklog.kindel.com">cek.log</a></li> 
    <li><a href="@Href("~/Services")">Services</a></li> 
    <li><a href="@Href("~/Charlie")">Charlie's Stuff</a></li> 
    <li><a href="@Href("~/Contact.cshtml")">Contact</a></li> 
</ul> 

В другом месте на SO я нашел вопросы похожи на мой, где люди хотели отслеживать выбранный пункт меню, но на динамической странице. Например:

Javascript Changing the selected Menu items class

Но этот подход не будет работать в моем случае, потому что в моем случае пользователь не изменяет выбор на одной странице, но перейти на другую страницу полностью.

Как это можно сделать?

Answer 1

... и я понял.

Я использовал Razor для реализации этого на стороне сервера.

Сначала я реализовал функцию на моей странице _SiteLayout.cshtml (шаблон все страницы используют):

@functions { 
    public string Selected(string PageTitle) { 
     if (Page.Title == PageTitle) 
      return "selected"; 
     else 
      return ""; 
    } 
} 

Затем я использовал эту функцию в моем списке:

<ul id="menu"> 
    <li class="@Selected("Home")"><a href="@Href("~/")">Home</a></li> 
    <li class="@Selected("cek.log")"><a href="http://ceklog.kindel.com">cek.log</a></li> 
    <li class="@Selected("Services")"><a href="@Href("~/Services")">Services</a></li> 
    <li class="@Selected("Charlie's Stuff")"><a href="@Href("~/Charlie")">Charlie's Stuff</a></li> 
    <li class="@Selected("Contact")"><a href="@Href("~/Contact.cshtml")">Contact</a></li> 
</ul> 

отлично работает. На моей внешней странице я просто закодировал ее, так как она основана на Wordpress, а не на Razor.