メニュー項目を選択してページ遷移するも、メニュー一覧が表示されたままになる

Question

■ 現状
スマホで閲覧する際、ヘッダーメニュー項目が１つのボタンに集約されるようになっていまして、
ボタンを押すとメニューが縦に並ぶ仕組みになっています。

参照

■ 問題点
メニューが並んだ際、どれかを選択すればメニュー項目が隠れ、選択したページに移るようになるのですが、今回”どれかを選択すればメニュー項目が隠れ”という機能が働かず、メニュー項目を押せば選択ページに移るものの、メニュー一覧表示が残ったままになっています。

■ お聞きしたいこと

jQueryが関係していると思いますが、問題点の原因と解決策をお聞きしたいです。
宜しくお願いいたします。

■ ソースコード

※ 該当するものがどれか分からずJQueryファイル内の全てのコードを反映してあります。

http://22.gigafile.nu/e08cef9d8f6081e791b52ceb57e423394-0119

Comments

[Lhankor_Mhy]

ソースコードはありますか？　『今回”どれかを選択すればメニュー項目が隠れ”という機能が働かず』とありますが、過去に機能していたことがあったのでしょうか。

[SuzukiToshiyasu]

ご質問ありがとうございます！ソース共有いたします！

[SuzukiToshiyasu]

ソースコードアップいたしました！

[Lhankor_Mhy]

これはjQueryのソースではありませんか？　そうではなくて、あなたが書いたコードが見たいのですが。

[SuzukiToshiyasu]

申し訳ありません。
コードの該当箇所をお送りします。

<header>
<div class="move">
<div class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><img src="img/KSlogo.png" class="logo" alt="logo"></a>
</div>
<div class="navbar-collapse collapse ">
<ul class="nav navbar-nav">
<li class="menulist"><a href="index.html">TOP</a></li>
<li class="menulist"><a href="index.html#concept">CONCEPT</a></li>
<li cla#s="menulist"><a href="index.html#interview">INTERVIEW</a></li>
<li class="menulist"><a href="contact.html"><p class="entry">ENTRY</p></a></li>
</ul>
</div>
</div>
</div>
</div>
</header>

Answer 1

補足ありがとうございます。つまり、bootstrapを使っているんですね。
確認してみたところ、標準的な書き方をしたbootstrapには『どれかを選択すればメニュー項目が隠れ』という機能がないようです。
以下で試してみてください。
https://getbootstrap.com/examples/navbar/

『どれかを選択すればメニュー項目が隠れ、選択したページに移る』ように見えるのは、ページ遷移が発生しているからで、ページ内リンクのようにページ遷移が発生しない場合は『どれかを選択すればメニュー項目が隠れ』はしないです。

解決法なのですが、bootstrapについてあまり詳しくないのですが、このようにすればいいのではないでしょうか。
http://s.bootply.com/render/lbIb5ZaHbq

<li><a href="#contact" data-toggle="collapse" data-target=".navbar-collapse.in">Close</a></li>

ドキュメントのこの部分の応用ですね。
https://getbootstrap.com/javascript/#collapse-example

ご不明な点があればコメントでご連絡ください。

Comments

[SuzukiToshiyasu]

解決しました！！ありがとうございます！！