单击关闭按钮时警报关闭不关闭 bootstrap laravel

Question

当我点击关闭按钮时，它并没有关闭通知。我错过了什么吗？

（提醒右上角的'x'符号）

这里是这个提醒的具体代码。我正在使用 Laravel 版本 5.8.15 和最新的 bootstrap 如果有帮助的话

<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>

Answer 1

您确定您正确集成了 bootstrap's javascript plugin 吗？你必须在调用 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>

单击关闭按钮时警报关闭不关闭 bootstrap laravel

alert-dismissible not closing wen clicking close button bootstrap laravel

twitter-bootstrap

laravel

bootstrap-4

laravel-5.8