bootstrap navbar активная ссылка

Question

У меня есть загрузочный навигатор, и я хочу, чтобы ссылки активировались в ожидании, в какой субдомен я с Javascript. Я исследовал весь форум, и я не нашел ничего, что сработало. Помоги мне, пожалуйста.

<nav class='navbar navbar-default'> 
    <div class='container-fluid'> 
<div class='navbar-header'> 
<div class='collapse navbar-collapse' id='navbar-collapse'> 
     <ul class='nav navbar-nav'> 
     <li><a href='#'></a></li> 
     <li><a href='#></a></li> 
     <li><a href='#'></a></li> 
    </ul> 
    </div> 
</div> 
    </div> 
</nav> 

Answer 1

Использование JQuery, потому что я ленивый:

// Get the page URL 
var url = window.location.href.split('/') 

// Get the subdomain 
var location = url[url.length-1] 

// Apply active class to the link that matches the subdomain. 
$('a[href$="' + location + '"]').addClass('active') 

Вам нужно изменить это на ваш случай использования.

Answer 2

Вот решение, но с JQuery:

jQuery(document).ready(function(){ 
 

 
    $path = window.location.href; 
 
    jQuery('a[href="' + $path + '"]').each(function(){ 
 
    jQuery(this).addClass('active'); 
 
    }); 
 

 
});

a{ 
 
    display: block; 
 
} 
 
a.active{ 
 
    background-color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 

 
<a href="#">A Link</a> 
 
<a href="http://stackoverflow.com/">Another link</a> 
 
<a href="http://stacksnippets.net/js">Active link</a>