Чтобы запустить модальное окно Bootstrap при загрузке страницы в JavaScript, вы можете использовать различные методы. Вот несколько подходов:
Метод 1: использование jQuery
$(document).ready(function() {
$('#myModal').modal('show');
});
В этом методе вы используете функцию $(document).ready(), чтобы убедиться в готовности DOM перед выполнением кода. Код выбирает модальный элемент с идентификатором myModalи вызывает метод modal('show')для отображения модального окна.
Метод 2: стандартный JavaScript
document.addEventListener('DOMContentLoaded', function() {
document.getElementById('myModal').classList.add('show');
});
При таком подходе вы прослушиваете событие DOMContentLoaded, которое срабатывает, когда исходный HTML-документ полностью загружен и проанализирован. Код выбирает модальный элемент с идентификатором myModalи добавляет класс showдля отображения модального элемента.
Метод 3. Использование событий начальной загрузки
document.getElementById('myModal').addEventListener('shown.bs.modal', function() {
// Modal has been shown
});
$(window).on('load', function() {
$('#myModal').modal('show');
});
В этом методе вы можете использовать встроенные события Bootstrap. Первая часть добавляет прослушиватель событий к событию shown.bs.modalмодального окна, которое срабатывает, когда модальное окно полностью отображается. Во второй части используется событие $(window).on('load'), чтобы убедиться, что все ресурсы страницы загружены перед отображением модального окна.