Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   <li class="active"> Не могу понять :( (https://javascript.ru/forum/css-html/8858-li-class%3D-active-ne-mogu-ponyat.html)

renelon 17.04.2010 13:42

<li class="active"> Не могу понять :(
 
:help:
Есть простой список:

<ul class="categories">
<li><a href="#">Games</a></li>
<li><a href="#">Books</a></li>
<li><a href="#">Music</a></li>
<li><a href="#">News</a></li>
</ul>

Как сделать так, что бы при нажатии на категорию выводился/присваивался class="active" (<li class="active">).
Какой ява код должен быть?

HELP!

Есть к этому скрипт:

<script type="text/javascript">
$(document).ready(function() {
//Событие по клику
$("ul.categories li").click(function() {
$("ul.categories li").removeClass("active"); //Удаление любого "active" класса
$(this).addClass("active"); //Добавление "active" класса на категорию
});
});
</script>

Но при переходе на нужную ссылку категории, класс "active" не сохраняется!
Что делать???
Нужно чтоб пункт меню соответствовал текущей странице!

exec 17.04.2010 17:46

$('ul.categories a').each(function () {
if (this.href == location.href) $(this).parent().addClass('active');
});

micscr 17.04.2010 17:48

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

renelon 17.04.2010 21:22

Не работает :(

Мож кто сталкивался? Как реализовать такую идею?

micscr 18.04.2010 15:51

Во первых.
<li><a href="#">Games</a></li>
href по сути не указан. Зачем там внутри ссылка? Если чтобы видимость ссылки создать то этого можно добиться и без <a> и ваш код renelon будет работать.

Если все таки ссылка нужна, просто не указана вами, и выглядит как то так:
<li><a href="#games">Games</a></li>
при нажатии на нее страница перезагрузится и нужно в
$(document).ready(function(){
// сюда
});
вписать код как подсказал exec. Только я не уверен что он полностью рабочий - сами уже проверьте что там в разных браузерах возвращает location.href - вхождение подстроки надо проверять.

e1f 19.04.2010 15:04

а еще лучше location.hash

renelon 20.04.2010 01:23

попробую!!! потом отпишусь :write: заранее спасибо:)

renelon 22.04.2010 20:39

Ура!!! Получилось!!! А чем отличается location.hash от location.href ???

e1f 23.04.2010 00:54

http://javascript.ru/window.location

renelon 23.04.2010 19:11

:)


Часовой пояс GMT +3, время: 06:30.