Home > Article > Web Front-end > A brief discussion on drop-down menu events in Bootstrap3
This article takes you through the events of the Bootstrap3 drop-down menu. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to everyone.
Bootstrap provides 4 events for the drop-down menu plug-in. By listening to these events, you can control specific Respond to user actions during the operation phase. These events and their meanings are shown in Table 4‑3.
| Event | Meaning |
|---|---|
| show.bs.dropdown | After the show method is called, this event is triggered immediately |
| shown.bs.dropdown | This event is triggered when the drop-down menu is visible to the user (and the transition effect is completed) |
| hide.bs.dropdown | After the hide method is called, this event is triggered immediately Event |
| hidden.bs.dropdown | This event is triggered after the drop-down menu has been hidden (and the transition effect is completed) |
Related recommendations: "bootstrap Tutorial"
If developers want to customize the functions of the drop-down menu, they can listen to these events through JavaScript to perform corresponding operations. Such as:
<script>
$('#myDropdown').on('show.bs.dropdown', function () {
alert("开始显示下拉菜单。");
});
$('#myDropdown').on('shown.bs.dropdown', function () {
alert("下拉菜单已经显示。");
});
$('#myDropdown').on('hide.bs.dropdown', function () {
alert("开始隐藏下拉菜单。");
});
$('#myDropdown').on('hidden.bs.dropdown', function () {
alert("下拉菜单已经隐藏。");
});
</script>For more programming-related knowledge, please visit: Programming Video! !
The above is the detailed content of A brief discussion on drop-down menu events in Bootstrap3. For more information, please follow other related articles on the PHP Chinese website!