Как можно на jQuery сделать, чтобы по переходу по ссылке к ней добавлялся класс active, а с предыдущей убирался? Чтобы в меню видеть, какой раздел сейчас открыт
(function(){
$('#menu li a').click(function () {
$('#menu li').removeClass('active');
$(this).parent().addClass('active');
return true;
});
}) ();
#menu li.active a{
color: #FFC002;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<ul id="menu">
<li class="active"><a href="#">Пункт</a>
<li><a href="#">Пункт</a>
<li><a href="#">Пункт</a>
<li><a href="#">Пункт</a>
</ul>
Вообще добавление и удаление классов CSS в jQuery осуществляется с помощью методов addClass() и removeClass().
Например:
$("button").click(function(){
$("#div1").addClass("important blue");
});
$("button").click(function(){
$("h1, h2, p").removeClass("blue");
});
Однако в вашем случае, возможно, jQuery вообще не понадобится, потому что при переходе по ссылке вы (предположительно) загружаете новую страницу в текущее окно браузера, что делает манипуляции с элементами старой бессмысленными.
Если же у вас это не переход по ссылке, а просто смена состояния страницы,
то используйте addClass и removeClass как в моём примере выше.
Подробнее о addClass и removeClass:
Через кукисы допустимо? При клике на пункт меню в переменную записывается ее номер, при загрузки страницы проверяется переменная и нужному элементу присваивается класс active.
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости