如标题中所述，bootstrap.js会在您滚动到页面末尾时立即从导航链接中删除活动的类。您可以在https://bbs-service.net/
处自己看看这个“问题”一切都很好，只要您不滚动到页面的末尾即可。起初，我想到了bootstrap滚动，但是我的研究并没有解决，因此stackoverflow基本上是我的最后希望。这是Bootstrap的某个功能吗？
这是发生此问题的页面之一的代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Referenzen</title>
<meta name="description" content="Wir bieten als engagierter Sicherheitsdienst in Berlin und Brandenburg, professionelle Sicherheitsdienstleistung und allgemeine Dienstleistungen an.">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat:400,700">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kaushan+Script">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="##censored##" crossorigin="anonymous">
<link rel="stylesheet" href="assets/css/imagehover.min.css">
<link rel="stylesheet" href="assets/css/mdb.min.css">
<link href="assets/css/slider.css" rel="stylesheet">
<link rel="stylesheet" href="assets/css/styles.css">
<script id="Cookiebot" src="https://consent.cookiebot.com/uc.js" data-cbid="##censored##" type="text/javascript" async></script>
</head>
<body id="page-top">
<nav class="navbar navbar-dark navbar-expand-lg fixed-top bg-white" id="mainNav">
<div class="container"><a class="navbar-brand" href="/"><img alt="BBS Logo" id="navbar-logo" src="/assets/img/logo.png" /></a><button class="navbar-toggler navbar-toggler-right" data-toggle="collapse" data-target="#navbarResponsive" type="button" data-toogle="collapse" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"><i class="fa fa-bars"></i></button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="nav navbar-nav ml-auto text-uppercase">
<li class="nav-item" role="presentation"><a class="nav-link" href="/">Start</a></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="profile-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dienstleistungen</a>
<div class="dropdown-menu" aria-labelledby="profile-dropdown">
<a class="dropdown-item" href="/baustellenbewachung">Baustellenbewachung</a>
<a class="dropdown-item" href="/brandschutz">Brandschutz</a>
<a class="dropdown-item" href="/citystreife">City Streife</a>
<a class="dropdown-item" href="/detektivdienste">Detektivdienste</a>
<a class="dropdown-item" href="/doorman">Doorman</a>
<a class="dropdown-item" href="/empfangsdienste">Empfangsdienste</a>
<a class="dropdown-item" href="/objektschutz">Objektschutz</a>
<a class="dropdown-item" href="/personenschutz">Personenschutz</a>
<a class="dropdown-item" href="/veranstaltungsschutz">Veranstaltungsschutz</a>
<a class="dropdown-item" href="/sicherheitstechnik">Sicherheitstechnik</a>
</div>
</li>
<li class="nav-item" role="presentation"><a class="nav-link" href="/jobs">Jobs/Karriere</a></li>
<li class="nav-item" role="presentation">
<a class="nav-link" href="/galerie">Galerie</a>
</li>
<li class="nav-item active" role="presentation">
<a class="nav-link active" href="/referenzen">Referenzen</a>
</li>
<li class="nav-item" role="presentation"><a class="nav-link" href="/kontakt">Kontakt</a></li>
<!--<li class="nav-item" role="presentation"><a class="nav-link js-scroll-trigger" href="#contact">Contact</a></li>-->
</ul>
</div>
</div>
</nav>
<div id="sidebar-container">
<a class="normal" id="dienstleistungen-info"><i class="fas fa-phone"></i></a>
</div>
<header class="masthead" style="background-image:url('assets/img/Berlin.jpg');">
<div class="container" style="height: 40em;"></div>
</header>
<section id="referenzen">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="text-uppercase" style="font-weight: 600">Referenzen</h2><br>
</div>
</div>
<div style="display: block !important;" class="row">
<?php include("wrapper/referenzen.html");?>
</div>
</div>
</section>
<footer>
<?php include($_SERVER['DOCUMENT_ROOT']."/wrapper/footer.php"); ?>
</footer>
<style>
strong {
font-weight: 700 !important;
}
</style>
<script src="assets/js/jquery.min.js" type="text/javascript">
</script>
<script src="https://code.jquery.com/jquery-migrate-1.2.1.min.js" type="text/javascript">
</script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js">
</script>
<script src="/assets/js/script.min.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js">
</script>
<script src="/assets/js/mdb.min.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.8.2/js/lightbox.min.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.js" type="text/javascript">
</script>
<script>
$(function() {
$('[data-toggle="tooltip"]').tooltip()
})
$("#dienstleistungen-info").click(function() {
$("#dienstleistungen-info").addClass("activeInfo");
toastr.options = {
debug: false,
onClick: hide(),
newestOnTop: false,
progressBar: false,
positionClass: "toast-bottom-right",
preventDuplicates: true,
showDuration: 200,
hideDuration: 200,
timeOut: 0,
extendedTimeOut: 0,
showEasing: "swing",
hideEasing: "linear",
showMethod: "slideDown",
hideMethod: "slideUp",
tapToDismiss: false,
closeButton: false,
};
setTimeout(function() {
toastr.info(" <h6 class='text-uppercase mb-4 font-weight-bold'>Berlin</h6> <table id='kontaktinformationen'> <tbody> <tr> <td><i class='fas fa-phone-volume'></i></td><td>+49 (0) 30 549 756 06</td></tr><tr> <td><i class='fas fa-fax'></i></td><td>+49 (0)30 - 470 537 42</td></tr><tr> <td><i class='fas fa-envelope'></i></td><td>info@bbs-service.net</td></tr></tbody> </table>");
}, 100);
});
function hide() {
if ($('#toast-container').length) {
toastr.clear();
setTimeout(function() {
$("#dienstleistungen-info").removeClass("activeInfo");
$("#dienstleistungen-info i").removeClass("activeIcon");
}, 200);
} else {
$("#dienstleistungen-info i").addClass("activeIcon");
}
}
</script>
<script>
$(document).ready(function() {
$('.customer-logos').slick({
slidesToShow: 6,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 4000,
arrows: false,
dots: false,
pauseOnHover: false,
responsive: [{
breakpoint: 768,
settings: {
slidesToShow: 4
}
}, {
breakpoint: 520,
settings: {
slidesToShow: 3
}
}]
});
$([document.documentElement, document.body]).animate({
scrollTop: ($('.masthead').height() - $('.navbar').height())
}, 1000);
});
</script>
</body>
</html>
也许在编码html文件时做错了什么？我不知道。
我真的希望有人可以帮助我解决这个问题。
谢谢！