Добавить активный класс Bootstrap Navbar с JQuery

Question

Проблема

Короче.

а) mysite.tld (ничего не происходит)

б) mysite.tld/somepage (.active добавляется)

Как вы можете видеть, б) будет иметь код надстройку. активным классом, однако код будет игнорироваться, если URL-адрес: a)

Однако на главной странице я не хочу, чтобы href сообщал href = "index.html" или что-то еще. Вместо этого он просто HREF = «mysite.tld»

Кодекс

var path = location.pathname.split('?')[0]; 
var start = path.lastIndexOf('/') + 1; 
var activeLink = path.substr(start); 

var parent = $('a[href*="' + activeLink + '"]').parent('li'); 
// These two lines check if you have dropdowns in your nav-bar 

    if (parent.closest('ul').hasClass('dropdown-menu')) { 
      parent.parents('.dropdown').addClass('active'); 
    } 

parent.addClass('active'); 

Answer 1

Вы пробовали регистрируя переменные, чтобы увидеть, что возвращается после загрузки страницы? Если вы используете хром, вы можете просто открыть консоль разработчика и посмотреть, что зарегистрировано. В качестве альтернативы, вместо console.log() вы можете использовать alert()

var path = location.pathname.split('?')[0]; 
    var start = path.lastIndexOf('/') + 1; 
    var activeLink = path.substr(start); 

    consolel.log(path); 
    console.log(start); 
    console.log(activeLink); 

    var parent = $('a[href*="' + activeLink + '"]').parent('li'); 
    // These two lines check if you have dropdowns in your nav-bar 

     if (parent.closest('ul').hasClass('dropdown-menu')) { 
       parent.parents('.dropdown').addClass('active'); 
     } 

    parent.addClass('active'); 

После того, как вы уверены, что соответствующие переменные тянет, идентификатор рекомендуют ограничить ссылку вниз тег или класс, который может быть, а также используя концы с обозначение ($) вместо того, содержит (*)

var parent = $('ul li a[href$="' + activeLink + '"]').parent(); 

Я мог бы также предложить отладку по setting breakpoints using the chrome DevTools

Answer 2

Я думаю, что это будет просто временное решение, так как location.href возвращается текущий URI.

if(location.href == //example.something) { 
    // add active class here 
} else { 
    // your code here 
}