alert-dismissible не закрывается при нажатии кнопки закрытия начальной загрузки laravel

Когда я нажимаю кнопку закрытия, уведомление не закрывается. Я что-то упускаю?

(символ «x» в правом верхнем углу предупреждения)

Кнопка закрытия не закрывает оповещение

Вот конкретный код этого предупреждения. Я использую Laravel версии 5.8.15 и последний бутстрап, если это поможет.

<div class="mg-auto justify-content-center">
        @if ($errors->any())
            <div class="alert alert-warning alert-dismissible" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="alert-heading">Oops! Something went wrong!</h4>
                <p>
                    @foreach ($errors->all() as $error)
                        - {{ $error }}<br>
                    @endforeach
                </p>
            </div>
        @endif
    </div>

Выравнивание файлов моего скрипта:

<script src="{{ asset('js.jquery-341.js') }}"></script>
<script src="{{ asset('js/bootstrap.min.js') }}"></script>

person KiritoLyn    schedule 28.05.2019    source источник
comment
Вы должны проверить, работает ли jQuery на вашей странице, может быть, это asset('js/jquery-341.js') вместо asset('js.jquery-341.js')?   -  person tcj    schedule 28.05.2019


Ответы (1)


Убедились ли вы, что правильно интегрировали плагин javascript для начальной загрузки? Вы должны вызвать его после того, как вы вызвали jQuery следующим образом:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" ></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js" ></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" ></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js" ></script>

<div class="mg-auto justify-content-center">
        @if ($errors->any())
            <div class="alert alert-warning alert-dismissible" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="alert-heading">Oops! Something went wrong!</h4>
                <p>
                    @foreach ($errors->all() as $error)
                        - {{ $error }}<br>
                    @endforeach
                </p>
            </div>
        @endif
    </div>

person tcj    schedule 28.05.2019
comment
Возможно, я использовал неправильные файлы начальной загрузки. могу я узнать, в чем разница между bundle и только min? - person KiritoLyn; 28.05.2019
comment
bundle включает плагин popper, который используется для отображения всплывающих окон, но после тестирования на моей стороне я понял, что он вам не нужен, я думаю, проблема была с интеграцией jQuery, верно? Потому что, если вы просто поставите перед ним плагин начальной загрузки без jQuery, он не будет работать. - person tcj; 28.05.2019
comment
Дополнительная информация здесь: getbootstrap.com/docs/4.3/getting-started/introduction. /#js - person tcj; 28.05.2019
comment
Возможно, я не включил плагин popper. Это могло быть причиной недостаточности моего кода, поэтому он не закрывается. Хорошо идет. - person KiritoLyn; 28.05.2019