Bootstrap 5 Dropdowns Автоматическое закрытие поведения

Bootstrap 5 Dropdowns Поведение автоматического закрытия используется для закрытия раскрывающихся списков, когда мы нажимаем за пределами этого раскрывающегося списка или этой конкретной кнопки. Приближение, когда пользователь щелкает снаружи, — это необходимая функция, которая должна быть в каждом раскрывающемся списке.

Bootstrap 5 Раскрывающиеся списки Автоматическое закрытие Класс: нет предопределенного класса для автоматического закрытия раскрывающегося списка по щелчку снаружи. Существует атрибут data-bs-auto-close, который может выполнять задачи.

Bootstrap 5 Dropdowns Автоматическое закрытие поведения Атрибут:

• data-bs-auto-close: этот атрибут содержит четыре значения: true, false, внутри и снаружи, false не позволяет закрыть раскрывающийся список, а true позволяет. Smae с внутренней и внешней материей щелчка.

Синтаксис: * можно заменить любым из значений, таких как true, false, внутри или снаружи.

<div class="btn-group">
 <button class="btn dropdown-toggle" type="button"
   data-bs-toggle="dropdown" data-bs-auto-close="*" >
    ...
 </button>
</div>

Примеры ниже иллюстрируют поведение Bootstrap 5 Dropdowns Auto close:

Пример 1: В этом примере мы узнаем об опциях autoClose true и false.

Выход:

Пример 2: В этом примере мы узнаем о параметрах autoClose внутри и снаружи .

Выход:

Ссылка: https://getbootstrap.com/docs/5.0/components/dropdowns/#auto-close-behavior