リンクをクリックしたときにBootstrap 3の折りたたまれたメニューを閉じる方法?

リンク上の Bootstrap 3 の折りたたまれたメニューを閉じる方法

Bootstrap 3 の折りたたまれたナビゲーション メニューは、リンク上のナビゲーション項目を非表示にしたり表示したりする便利な方法を提供します。より小さなデバイス。ただし、メニューが展開されているときにメニュー リンクをクリックしても、クリックしてもメニューが閉じない場合があります。これは簡単なナビゲーションを妨げるため、ユーザーにとってイライラする可能性があります。

解決策

この問題に対処するには、次のコードをドキュメントに追加できます。

$(document).on('click', '.navbar-collapse.in', function(e) {
  if ($(e.target).is('a:not(".dropdown-toggle")')) {
    $(this).collapse('hide');
  }
});

このコードは、折りたたまれたメニュー内のクリックをリッスンし、ターゲット要素がドロップダウン トグルでない場合はメニューを閉じます。ドロップダウンの切り替えを除外することで、ドロップダウン メニュー自体をクリックしてもドロップダウン メニューが閉じないようにすることができます。

実装

このソリューションを実装するには、 JavaScript ファイルを追加するか、ページ下部の終了

以上がリンクをクリックしたときにBootstrap 3の折りたたまれたメニューを閉じる方法?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。