Mengapakah lungsur navbar Bootstrap 5 saya tidak berfungsi walaupun dengan jQuery?-tutorial js-php.cn

Mengapakah lungsur navbar Bootstrap 5 saya tidak berfungsi walaupun dengan jQuery?

Susan Sarandon

Lepaskan： 2024-12-08 19:32:14

asal

239 orang telah melayarinya

Why isn't my Bootstrap 5 navbar dropdown working even with jQuery?

Bootstrap 5 Navbar Dropdown Issue

Apabila cuba untuk melaksanakan menu navigasi responsif menggunakan Bootstrap 5, pengguna mungkin menghadapi masalah apabila butang dropdown atau item menu tidak berfungsi seperti yang dimaksudkan. Isu ini boleh timbul walaupun apabila jQuery disertakan dalam projek.

Sebab

Dalam Bootstrap 5, atribut data-* untuk pemalam JavaScript telah berubah. Sebelum ini, togol data dan sasaran data telah digunakan, tetapi dalam Bootstrap 5, mereka telah digantikan dengan togol data-bs dan sasaran data masing-masing.

Penyelesaian

Untuk menyelesaikan isu, gantikan data lama- atribut dengan data-bs- baharu atribut:

<button>

Salin selepas log masuk

Pertimbangan Tambahan

Selain perubahan dalam atribut data-*, Bootstrap 5 juga memperkenalkan perubahan lain. Contohnya, kelas ml-auto dan mr-auto telah digantikan dengan ms-auto dan me-auto.

Demo

Coretan kod ini menunjukkan lungsur turun berfungsi butang:

<!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&#160;protected]/dist/css/bootstrap.min.css"
        rel="stylesheet"
        integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1"
        crossorigin="anonymous"
    />
</head>
<body>
    <nav>

Salin selepas log masuk

Atas ialah kandungan terperinci Mengapakah lungsur navbar Bootstrap 5 saya tidak berfungsi walaupun dengan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!