?? ??? ?? ?? ??? ?????? JavaScript? ???????. ?? ?? ???? ???? ?? ?? ??? ?????????. show.bs.dropdown ? hidden.bs.dropdown? ?? ??? ???? ??????. ?? ?? ??? (? : show () ? hide ())? ???? ???? ?? ?? ??? ??? ?????.

?? ?? ??? ????? ?? JavaScript? ???? ?? ???

Bootstrap? ?? ?? ??? ???? ???? ???? ?? ?? ??? ?????. JavaScript? ???? ?? ?? ??? ?????? ?? ??? ??????.

1. ?? ??? ?? ???? ??

HTML ????? ?? ??? ?? ???? ?????? ??????.

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>

2. ?? ?? ??? ?????????

?????? ?? ?? ??? ?? Bootstrap? ?? ?? ???? ???? ?????????.

 <code class="javascript">const dropdown = new bootstrap.Dropdown(document.getElementById('dropdown-element'));</code>

3. ??? ??? ???

??? ?? ??? ??? ???? ?? ?? ??? ??? ? ? ????. ? ?? ?? ??? ????.

• show.bs.dropdown : ?? ?? ??? ???? ?? ????????
• show.bs.dropdown : ?? ?? ??? ??? ? ????????
• hide.bs.dropdown : ?? ?? ??? ???? ?? ????????
• hidden.bs.dropdown : ?? ?? ??? ??? ? ????????

??? ???? ?????? on() ???? ??????.

 <code class="javascript">dropdown.on('show.bs.dropdown', (e) => { // 在此添加要執(zhí)行的操作}); dropdown.on('hidden.bs.dropdown', (e) => { // 在此添加要執(zhí)行的操作});</code>

4. ?? ?? ?? ??? ??????

?? ?? ??? ??? ???? ?? ?? ??? ??? ?? ? ? ????. ? ?? ?? ??? ????.

• show () : ?? ?? ?? ??
• ??? () : ?? ?? ??? ? ???
• ?? () : ?? ?? ??? ?????/??? ?? ??
• Dispose () : ?? ?? ?? ????? ??????

? ??? ????? ?? ??? ??????.

 <code class="javascript">dropdown.show(); dropdown.hide(); dropdown.toggle(); dropdown.dispose();</code>

? ??? ???? JavaScript? ???? ?? ????? ?? ?? ??? ?? ????? ?? ? ? ????.

? ??? ?? ??? ?? ?? ??? ????? ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!