Добавьте определенный класс к ul, который содержит ссылку на текущую страницу

Question

Добавьте определенный класс к ul, который содержит ссылку на текущую страницу

0

У меня есть следующий код HTML:

 <li><a href="index.php"> Home</a></li>
 <li><a href="manageArticles.php"> Contact</a></li>
 <li><a href="addArticle.php"> More...</a></li>

Мне нужно добавить класс, active в li который содержит ссылку на страницу cirrent.

Для axample на странице index.php для второго тега li должен добавлен класс active.

У меня есть код сценария, который получает текущий URL:

 var currentPageName = document.location.href.match(/[^\/]+$/)[0];

Но я не знаю, что мне делать после этого (и если это возможно).

Пожелайте о помощи, спасибо!

Nave Tseva 01 дек. 2013, в 18:38

Источник

0

В моем тесте регулярное выражение не работало, поэтому я использовал: window.location.pathname
Bas van Dijk 01 дек. 2013, в 17:09
2

$('li a[href="'+currentPageName+'"]').closest('li').addClass('active')
adeneo 01 дек. 2013, в 17:12
0

вам действительно нужно, чтобы это был javascript? такие вещи лучше обрабатываются на стороне сервера, проверяя request_uri
arieljuod 01 дек. 2013, в 17:17

Показать ещё 1 комментарий

Теги:

jquery

html

url

1 ответ

Ещё вопросы

В моем тесте регулярное выражение не работало, поэтому я использовал: window.location.pathname
$('li a[href="'+currentPageName+'"]').closest('li').addClass('active')
вам действительно нужно, чтобы это был javascript? такие вещи лучше обрабатываются на стороне сервера, проверяя request_uri

u_mulder · Accepted Answer · 2013-12-01T15-08-00.000Z

Используйте функцию filter чтобы получить li которые содержат a с href -attr, который равен currentPageName;

var currentPageName = document.location.href.match(/[^\/]+$/)[0];
$( 'li' )
    .filter(function() { return $( 'a' , this ).attr( 'href' ) === currentPageName; } )
    .addClass( 'active' );