Забыли пароль?
Запросите новый здесь.

Автор темы: Zaxap
ID темы: 1999
Информация:
Тема содержит 10 сообщения, была просмотрена 5884 раз.
Просмотр темы
PHP-Fusion Russia » Веб-разработка » Javascript, ajax, jquery
 Распечатать тему
Выделение активного пункта меню.
Zaxap
Использую, скажем так, нестандартное, т.е. не showlinks(), меню.
Необходимо было выделить ссылки, на которых находишься - использовал jquery:
Загрузить источник  GeSHi: Javascript
  1. jQuery(document).ready(function($) {
  2. var url=document.location.href;
  3. $.each($("nav ul li a"),function(){
  4. if(this.href==url){$(this).addClass('active');};
  5. });
  6. })(jQuery);
Добавлено за 0.002 секунд, используя GeSHi 1.0.8.10


Но вот незадача: выделяются только ссылки, точно соответствующие указанным в <a href=""></a>, так, например, пукнт "новости" выделяется только при нахождении на непосредственно /news.php, а при попадании на /news.php?readmore=2 выделение пропадает...
Как "модифицировать" код, указанный выше, чтобы добиться требуемого результата??

Оффтопик извините за корявый язык...уже 2-е сутки пилю код...сейчас ночь - голова ватная ;)

Зло не дремлет, а я добрый...
 
Polarfox
Посмотри регулярки на js, проще ты не сделаешь.
Всегда делайте backup перед изменениями | Указывайте свою версию в подписи/профиле. | Вся бесплатная тех. поддержка только на форуме

PolarLab - вход для подопытных
 
Web
Zaxap
PolarFox, мне бы лучше готовый вариант...
Ну или переделку этого кода, что я кинул:

Загрузить источник  GeSHi: Javascript
  1. jQuery(document).ready(function($) {
  2. var url=document.location.href;
  3. $.each($("nav ul li a"),function(){
  4. if(this.href==url){$(this).addClass('active');};
  5. });
  6. })(jQuery);
Добавлено за 0.002 секунд, используя GeSHi 1.0.8.10


А что за регулярки для этого надо - мозг не варит...хз))
/извините, но я сонный, и я хочу жрать/
Зло не дремлет, а я добрый...
 
Polarfox
Оффтопик Иди спи да ешь, я конечно могу в любых условиях чо угодно делать, но то ж я, а другим я рекомендую делать все правильно для здоровья.

По типу регулярки не далеки от хпхшных только синтаксис другой, вот тебе пример
Загрузить источник  GeSHi: Javascript
  1. if (/texthere/.test(subject)) {
  2. // Successful match
  3. } else {
  4. // Match attempt failed
  5. }
Добавлено за 0.001 секунд, используя GeSHi 1.0.8.10

Всегда делайте backup перед изменениями | Указывайте свою версию в подписи/профиле. | Вся бесплатная тех. поддержка только на форуме

PolarLab - вход для подопытных
 
Web
lucky
попробуй это:

active.js
Загрузить источник  GeSHi: Javascript
  1. $(function(){
  2. try{
  3. var el=document.getElementById('nav').getElementsByTagName('a');
  4. var url=document.location.href;
  5. for(var i=0;i<el.length; i++){
  6. if (url==el[i].href){
  7. el[i].className += ' activeClass';
  8. };
  9. };
  10. }catch(e){}
  11.  
  12. });
Добавлено за 0.002 секунд, используя GeSHi 1.0.8.10


где getElementById('nav') это твой div id="nav",

getElementsByTagName('a') естественно это все ссылки в блоке div id="nav", к которым при клике будет добавляться новый класс activeClass
 
Zaxap
Печально, но не работает т.т
Возможно, потому что у меня:

Загрузить источник  GeSHi: PHP
  1. <nav>
  2. <ul id='nav'>
  3. <li><a href='' class='home'>home</a></li>
  4. <li><a href='' class='news'>news</a></li>
  5. <li><a href='' class='articles'>articles</a></li>
  6. <li><a href='' class='forum'>forum</a></li>
  7. </ul>
  8. </nav>
Добавлено за 0.030 секунд, используя GeSHi 1.0.8.10


И никакого div просто нет...))
Зло не дремлет, а я добрый...
 
Pisatel
Загрузить источник  GeSHi: Javascript
  1. jQuery(document).ready(function($) {
  2. var url=window.location.href;
  3. $.each($("#nav li"),function(){
  4. if(this.href==url){$(this).addClass('active');};
  5. });
  6. })(jQuery);
Добавлено за 0.002 секунд, используя GeSHi 1.0.8.10

Попробуй так. Класс должен добавляться не к ссылке, а к элементу списка li. Разметка будет такой
Загрузить источник  GeSHi: HTML
  1. <div id='nav'>
  2. <ul>
  3. <li class=''><a href='one.php'>One</a></li>
  4. <li class=''><a href='two.php'>Two</a></li>
  5. .....
  6. </ul>
  7. </div>
Добавлено за 0.005 секунд, используя GeSHi 1.0.8.10


Объединенно в 30.12.2013 08:01:
Либо еще здесь посмотри обсуждение про определение полного пути

Объединенно в 30.12.2013 08:06:
З.ы.
Оффтопик К администрации: при объединении сообщений правильно будет "Объединено", а не "Объединенно"

Изменил(а) Pisatel, 30.12.2013 05:06
x1 x1
 
Web
jikaka
Pisatel,
Оффтопик спасибо, поправил, тянется видимо еще с 7.01

 
Web
Zaxap
Спасибо! Все оказалось довольно просто: href заменил на pathname ab
Зло не дремлет, а я добрый...
 
lucky
Zaxap написал:

Печально, но не работает т.т
Возможно, потому что у меня:

Загрузить источник  GeSHi: PHP
  1. <nav>
  2. <ul id='nav'>
  3. <li><a href='' class='home'>home</a></li>
  4. <li><a href='' class='news'>news</a></li>
  5. <li><a href='' class='articles'>articles</a></li>
  6. <li><a href='' class='forum'>forum</a></li>
  7. </ul>
  8. </nav>
Добавлено за 0.029 секунд, используя GeSHi 1.0.8.10


И никакого div просто нет...))


с тэгом <nav> не пробовал,

у меня разметка такая:

Загрузить источник  GeSHi: HTML
  1. < ul id="nav"><li><a href="glavnaya">Главная</a></li>
  2. <li><a href="chem-lovit">Чем ловить?</a></li>
  3. <li><a href="na-chto-lovit">На что ловить?</a></li>
  4. <li><a href="kak-lovit">Как ловить?</a></li>
  5. </ul>
Добавлено за 0.004 секунд, используя GeSHi 1.0.8.10

и с <div> и с <ul> работает,

а пробовал вместо id=nav написать например id=nav33 ? а то в твоей разметки имена HTML5-тэга <nav> и ид списка <ul id='nav'> совпадают, может быть из-за этого
Изменил(а) lucky, 30.12.2013 08:09
 

Поделиться этой темой
Социальные закладки: Vkontakte Odnoklassniki Mail.ru Facebook Google Tweet This
URL:
BBcode:
HTML:

Перейти на форум: