Rumah >hujung hadapan web >tutorial js >Mengapakah lungsur navbar Bootstrap 5 saya tidak berfungsi walaupun dengan jQuery?

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

Susan Sarandon
Susan Sarandonasal
2024-12-08 19:32:14170semak imbas

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>

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>

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!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn