Bootstrap 5 の Navbar ドロップダウンが機能しない: データ属性の問題を修正するには?

Bootstrap 5 でナビゲーションバーのドロップダウンが機能しない: 解決されました

Bootstrap 5 でレスポンシブなナビゲーション メニューを作成するときに、ユーザーがドロップダウン機能に関する問題に遭遇しました。 。必要なアイコンがあり、jQuery が含まれているにもかかわらず、ナビゲーション ボタンまたはドロップダウン ボタンをクリックすると、ドロップダウン メニューが表示されません。

解決策:

Bootstrap 5 では、data- Bootstrap 4 で以前に使用されていた 属性は、Bootstrap 機能を他の機能と区別するために data-bs- に更新されました。コード。この変更は、ナビゲーションバーの折りたたみを含む、JavaScript プラグインに使用される属性に影響を与えました。適切な機能を確保するには、次のように data- 属性を data-bs- に置き換えます。

<button class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#navbar">
    <span class="navbar-toggler-icon"></span>
</button>

デモ:

[挿入作業]デモはこちら]

追加考慮事項:

• Bootstrap 5 は重大な変更を導入する重要なアップデートです。
• 以前に使用されていた mr-auto/ml-auto クラスは ms-auto/me に置き換えられました。 -auto.

以上がBootstrap 5 の Navbar ドロップダウンが機能しない: データ属性の問題を修正するには?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。