Сохранять выбранное меню после обратной передачи

Question

Как сохранить выбранное меню, оставаться активным даже после обратной передачи? Ниже приведены кодировки, которые я использую в настоящее время.

HTML

<div id="menu-promo"> 
    <ul> 
    <li><a href="#">menu1</a></li> 
    <li><a href="#">menu2</a></li> 
    <li><a href="#">menu3</a></li> 
    <li><a href="#">menu4</a></li> 
    </ul> 
</div> 

CSS

#menu-promo {background-color: #ff9100; display: inline-block; font-family: Calibri; width: 100%; padding: 45px 20px 20px 20px; border: 1px 0px 0px 0px solid #b3e5fc; font-weight: bold; color: #fff!important;} 
#menu-promo ul {margin: 0; padding: 0; text-align: center; display: block;} 
#menu-promo ul > li {list-style: none; display: inline-block;} 
#menu-promo ul > li a {color: #fff; border: 2px solid #ff9100; border-radius: 20px; padding: 10px 20px 10px 20px; text-decoration: none;} 
#menu-promo ul > li a:hover {background-color: #eeeeee; border: 2px solid #01579b; cursor: pointer; color: #01579b; text-decoration: none;} 
#menu-promo ul li a.active {background-color: #eeeeee; border: 2px solid #01579b; cursor: pointer; color: #01579b; text-decoration: none;} 

JS

$(function() { 
    var selector = '#menu-promo ul li a'; 

    $(selector).on('click', function() { 
     $(selector).removeClass('active'); 
     $(this).addClass('active'); 
    }); 
}); 

Answer 1

Один из вариантов заключается в регистрации сценария запуска в каждое событие page_load в вашем коде для вызова функции JavaScript.

Эта функция требует установки идентификатора для каждого пункта меню и передачи этого идентификатора, например. #menuItemID

function setActive(menuItemID){ 
    var selector = '#menu-promo ul li ' + menuItemID; 
    $(selector).addClass('active'); 
} 

C# & VB.Net (Может быть [GetType]() для VB)

ClientScript.RegisterStartupScript(GetType(), "Javascript", "javascript:setActive(thisMenuItemID); ", true); 

Если текст элементы меню сопрягать ваши имена страниц правильно, вы можете использовать функцию как

function setActive(){ 
    // Might need to play with substring parameters 
    var selector = '#menu-promo ul li a[name=' + location.pathname.substring(0, location.pathname.indexOf(".")) + ']'; 
    $(selector).addClass('active'); 
}