Как при помощи jQuery добавить/убрать класс в ul li a списке?

sparco 31.10.2014 Шаблоны (TPL), jQuery 3173

вопрос

Доброго дня! Предположим, имеется следующее меню в шапке сайта:


<nav>
 <ul class="head_menu">
  <li><a href="#fakelink">Пункт меню</a></li>
  <li><a href="#fakelink">Пункт меню</a></li>
  <li><a href="#fakelink">Пункт меню</a></li>
  <li><a href="#fakelink">Пункт меню</a></li>
  <li><a href="#fakelink">Пункт меню</a></li>
  <li><a href="#fakelink">Пункт меню</a></li>
</ul>
</nav>

Так вот вопрос в следующем: как сделать, что бы при переходе по какому-либо из пунктов меню добавлялся класс active или current и убирался с предедущего? Вопрос может и баянистый, и многие скажут, мол, иди гугли, ответов тысяча. согласен, их много. Перепробовал более десятка вариантов и не один толком не заработал. Максимум что мне удалось - это добавить класс к выбранному анкору до загрузки страницы. После загрузки этот класс пропадает, почему-то.

Ответил: FastFud

Пример

3 комментария

Юзер

1599

FastFud - 2015-02-2431 октября 2014 13:06 - #36999

***Комментарий удален***

Юзер

sparco - 2015-02-2431 октября 2014 16:30 - #37012

FastFud, К сожалению данный способ не работает. Если к примеру создать 4 html документа с вот таким содержанием:

Показать / Скрыть текст


<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Add & remove active class from ul li a</title>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script>
$('ul li a').click(function() {
    $('ul li').removeClass('active');
    $(this).closest('li').addClass('active');
});
</script>
<style>
    body {margin: 0 auto; font-size: 15px;}
    a {color: blue;}
    nav {margin-top: 25px;}
    li.active, li.active a {
        color: red;
    }
    .head_nav {display: inline-block; list-style: none;}
    .head_nav > li {float: left; margin-right: 10px;}    
</style>
</head>
<body>
    <nav>
        <ul class="head_nav">
            <li><a href="1.html" class="active">menu 1</a></li>
            <li><a href="2.html">menu 2</a></li>
            <li><a href="3.html">menu 3</a></li>
            <li><a href="4.html">menu 4</a></li>
        </ul>
    </nav>
</body>
</html>

то класс не добавляется при переходе на другую страницу...

Юзер

1599

FastFud - 2015-02-2431 октября 2014 17:25 - #37016

Смотрите тут

TeraMoune | Как отключить миниатюры стандартной гале ...
TeraMoune
Как отключить миниатюры стандартной галереи Fancybox?
Сегодня, 06:00
В файле engine/classes/fancybox/fancybox.js искать нужную инициализацию и добавлять соответствующие параметры, весь список параметров и их описание можно найти на этой странице https://fancyapps.com/fancybox/api/options/

Например: параметр Thumbs: false отключает миниатюры.
```
Fancybox.bind("[data-highslide]", {
	groupAttr: 'data-highslide',
	idle:2000,
	Thumbs: false,
	caption: (fancybox, slide) => {
		if(  slide.thumbEl && slide.thumbEl.alt ) {
			return slide.thumbEl.alt
		}
	}
});
```
derebas | Как реализовать шифрование трафика? ³

derebas
Как реализовать шифрование трафика?
18-11-2024, 16:52

Ну в теории, можно использовать src на site.com разместить прокси на site2.com а выдавать видео с site3.com, при этом прямой доступ на site3.com закрыть, отдача будет только если запрос с site2.com, таким образом палится только site2.com, НО источник потокового видео, все равно можно увидеть если захотеть, а ссылки, ну купить домен dsac-43efew-csdds.uz как пример
Gordi | Перенёс сайт - не работают кнопки, не от ... ⁸

Gordi
Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
18-11-2024, 14:46

я уже делал. Пользователь 1000 (это я так понимаю root) и chmod 777
Так и было...
lutskboy | Перенёс сайт - не работают кнопки, не от ... ⁸

lutskboy
Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
18-11-2024, 14:39

чтоб не удалять выстави права и пользователя какие там идут на файлы. .
Gordi | Перенёс сайт - не работают кнопки, не от ... ⁸

Gordi
Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
18-11-2024, 14:37

т.е. мне снести всё, что я уже загрузил как root, зайти под юзером и закачать снова?
Видосы в директории upload можно хоть оставить? их там 80 Гб
lutskboy | Перенёс сайт - не работают кнопки, не от ... ⁸

lutskboy
Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
18-11-2024, 14:17

фтп обычный юзер а не root
Gordi | Перенёс сайт - не работают кнопки, не от ... ⁸

Gordi
Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
18-11-2024, 14:15

дэк только так и загружаю
Gordi | Как реализовать шифрование трафика? ³

Gordi
Как реализовать шифрование трафика?
18-11-2024, 14:14

я тоже не понимаю....товарищ один, представитель хостинга сказал, что даже есть модули такие специальные под популярные цмс
lutskboy | Перенёс сайт - не работают кнопки, не от ... ⁸

lutskboy
Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
18-11-2024, 14:13

Gordi,
через фтп загружай
Gordi | Перенёс сайт - не работают кнопки, не от ... ⁸

Gordi
Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
18-11-2024, 14:11

Привет Николай!
Всегда загружал от root... посмотришь может? твой плагин тоже не виден ((
или направь на путь истинный, пжст

наверх

Как при помощи jQuery добавить/убрать класс в ul li a списке?

Ответил: FastFud

3 комментария

Похожие вопросы

Класс current в dle

Подсветка активного пункта меню и подменю

Изменение шаблона топ новостей

Автообновление DIV блока через Javascript

navigation.tpl отказывается дружить!

Выдвижное меню

Меню поднялось к новости

Почему не работают табы при ajax full story?

Как вывести просмотры определенной новости ?