1
EDIT：私はプロジェクトをローカルで（ブラケットのライブプレビューを使用して）実行すると問題が存在しないことに気付きました。この問題は、Webサイトをgetforge.ioにデプロイする場合にのみ発生します。私のウェブサイト上のJavaScriptは、ページを更新した後にのみ機能するのはなぜですか？
私はHTML/CSS/Bootstrap/JSを使用して複数ページのウェブサイトを持っています。別のページに移動すると、Navbarのドロップダウンメニューが機能しません（Navbarを開くことはできますが、ページを更新しない限り、[About]ドロップダウンが機能しません）。私は同じ問題を抱えている別のページにスライディングパネルを持っていますが、ページロード後にリフレッシュすると機能します。アンカーにdata-ajax = "false"を追加しようとしましたが、うまくいきませんでした。ここではいくつかのコードは次のとおりです。
<!DOCTYPE html>
<link rel="stylesheet" type="text/css" href="resources/css/font-awesome/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="vendors/css/normalize.css">
<link rel="stylesheet" type="text/css" href="vendors/css/grid.css">
<link rel="stylesheet" type="text/css" href="vendors/css/ionicons.min.css">
<link rel="stylesheet" type="text/css" href="vendors/css/animate.css">
<link rel="stylesheet" type="text/css" href="resources/css/style.css">
<link rel="stylesheet" type="text/css" href="resources/css/queries.css">
<link href='http://fonts.googleapis.com/css?
family=Lato:100,300,400,300italic' rel='stylesheet' type='text/css'>
<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="/manifest.json">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="theme-color" content="#ffffff">
<title>Level Red Boxing</title>
</head>
<body>
<header class="landingHeader">
<nav>
<div id="top" class="row">
<a href="index.html"><img src="resources/css/img/brand2.png"
class="logo"></a>
<ul class="main-nav js--main-nav">
<li><a id="workout" href="theworkout.html">The Workout</a>
</li>
<li><a href="motivators.html">Trainers</a></li>
<li class="dropdown"><a class="dropdown-toggle" data-
toggle="dropdown" href="#">About<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="thelevels.html">The Levels</a></li>
<li><a href="sixpunches.html">Learn the Moves</a>
</li>
<li><a href="philosophy.html">Philosophy</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="press.html">Press</a></li>
<li><a href="privateevents.html">Private Events</a>
</li>
</ul>
</li>
<li><a href="contact.html">Contact</a></li>
<li><a href="buyclasses.html">Buy Classes</a></li>
<li><a href="schedule.html">Schedule</a></li>
<li><a href="index.html" class="accountButton">My
Account</a></li>
</ul>
<a class="mobile-nav-icon js--nav-icon"><i class="ion-navicon-
round"></i></a>
</div>
</nav>
</header>
<script src="//cdn.jsdelivr.net/respond/1.4.2/respond.min.js"></script>
<script src="//cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="//cdn.jsdelivr.net/selectivizr/1.0.3b/selectivizr.min.js">
</script>
<script src="resources/js/script.js"></script>
</body>
そしてここでは、パネルをスライドさせるための機能である：
<script>
$(document).ready(function() {
$(".flip").click(function() {
$('.panel').not($(this).next(".panel").slideToggle("slow")).slideUp("slow");
});
});
</script>
移動先のページにドロップダウンに必要なスクリプトを含めますか？ – Strernd
コンソールでエラーが発生しましたか？ – margarita
他のページにスクリプトを含めましたか？それとも、それが機能するために他のページを再現する必要があるのですか？ – margarita