noganno
11/10/2013 - 10:59 AM

Добавляем класс active в зависимости от URL

Добавляем класс active в зависимости от URL

Представьте, что у нас есть следующая навигация:


<nav>

    <ul>

        <li><a href="/">Home</a></li>

        <li><a href="/about/">About</a></li>

        <li><a href="/clients/">Clients</a></li>

        <li><a href="/contact/">Contact Us</a></li>

    </ul>

</nav>
Пример URL:


http://yoursite.com/about/team/
В результате странице About будет присвоен класс "active".


$(function() {

  $('nav a[href^="/' + location.pathname.split("/")[1] + '"]').addClass('active');

});
Вообще под селектор попадут все ссылки с фрагментом строки "/about" в атрибуте href.