我正在尝试使用 jQuery 将.active
类添加到我的 Bootstrap 导航链接中。我正在使用我在其他地方找到的一些简单代码,但不得不对其进行修改。
我希望在相关目录中的任何页面上将.active
类添加到相关.nav-link
中,例如,无论用户是在/photography 页面还是/photography/fashion页面上,都将该类添加到导航栏中的摄影链接中。
这就是我目前所拥有的;
$(document).ready(function() {
var urlFull = window.location.pathname.split( '/' );
var urlFirst = '/' + urlFull[1];
$('.navbar-nav .nav-link').each(function() {
if (this.href === urlFirst) {
$(this).addClass('active');
}
});
});
我很确定我的问题与if
语句有关,但我对 Javascript 很陌生,我看不到问题所在!我使用控制台.log来检查我的变量,它们与导航中设置的链接相对应。
任何帮助将不胜感激。
回答我自己的问题...
看起来我的问题与this.href
有关,而它应该this.pathname
.它现在似乎工作正常,但时间会证明我何时构建了更多页面!