Bootstrap 5 導(dǎo)航欄下拉問題
嘗試使用 Bootstrap 5 實現(xiàn)響應(yīng)式導(dǎo)航菜單時，用戶可能會遇到下拉按鈕的問題或菜單項無法按預(yù)期運行。即使項目中包含 jQuery，也可能會出現(xiàn)此問題。
原因
在 Bootstrap 5 中，JavaScript 插件的 data-* 屬性已更改。之前使用的是 data-toggle 和 data-target，但在 Bootstrap 5 中，它們已分別替換為 data-bs-toggle 和 data-bs-target。
解決方案
要解決此問題，請將舊的 data- 屬性替換為新的 data-bs-屬性：
<button>
其他注意事項
除了 data-* 屬性的更改之外，Bootstrap 5 還引入了其他更改。例如，ml-auto 和 mr-auto 類已替換為 ms-auto 和 me-auto。
演示
此代碼片段演示了功能下拉列表按鈕：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Bootstrap</title>
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1"
crossorigin="anonymous"
/>
</head>
<body>
<nav>以上是為什么我的 Bootstrap 5 導(dǎo)航欄下拉菜單即使使用 jQuery 也不起作用？的詳細(xì)內(nèi)容。更多信息請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！