仅适用于一个元素的活动



我正在使用jQuery将活动添加到我的菜单中。它在索引页上有效,但我现在无法在其他页面上使用它。我试着更改网址以适应确切的位置。pathname,但似乎不起作用,我也试着删除它之前的\。如有任何帮助,我们将不胜感激。

我的标记:

<nav class="sticky-top navbar navbar-expand-lg navbar-light bg-myColor">
<a class="navbar-brand" href="#">
<img src="image/VC-Logo.png" alt="Visionary Creatives logo" height="150px;" />
</a>
<button class="navbar-toggler navbar-brand" type="button" data-toggle="collapse" data-target="#navToggle" aria-controls="navToggle" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navToggle">
<ul class="navbar-nav mr-auto mt-2 mt-lg-0">
</ul>
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/coming-soon.php">Web Design</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/coming-soon.php">Graphic Design</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/coming-soon.php">SEO &amp; Marketing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/coming-soon.php">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/coming-soon.php">Contact Us</a>
</li>
</ul>
</div>
</nav>

和我的jQuery:

$(document).ready(function() {
$('.navbar-nav .nav-item a[href="' + this.location.pathname + 
'"]').parent().addClass('active');
});

和我的网站,如果这也有帮助:http://www.visionary-creatives.com

当我浏览您网站的view-source页面时。我看到,在除了index页面之外的其余页面中,这些脚本在页面源的末尾缺失

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
<script type ="text/javascript" src="js/lightbox.js"></script>
<script type="text/javascript" src="js/jQuery.js"></script>

请打开您的浏览器控制台,您会在那里看到一些错误。所以,请添加上面的脚本,这样你的代码就会运行到的每一页

您的代码是完美的,并且运行良好。

相关内容

最新更新