Bootstrap 模式不会在 Laravel 项目中关闭

Question

我正在做一个 Laravel 项目。提交表单后，如果验证器没问题，它会弹出一个 bootstrap 模态，如下所示。

@php
   if(session('message_success')) {
       echo "<script>
                $('#thank-you').modal('show');
             </script>";
   }
@endphp

模态显示相应，但由于某些原因，我无法关闭它。

模态

<div class="modal" id="thank-you" tabindex="-1"
     aria-labelledby="anyotherlabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-body">
                <button type="button" class="btn-close"
                        data-bs-dismiss="modal" aria-label="Close"
                        style="float: right;"></button>
                <div class="text-center py-3">
                    <h3 class="title-form-catalogue">The Club is thankful
                        for your request!</h3>
                    <p>Take a look at your e-mail to get access to the prestigious
                        information you required.</p>
                </div>
            </div>
        </div>
    </div>
</div>

在模态框外单击会关闭它，但单击按钮不会执行任何操作。

在某些情况下，我了解到淡入淡出 class 似乎阻止了模态框关闭，但我不确定这是否是问题所在。非常感谢您的帮助。

Answer 1

我设法找到了解决方案。我给按钮添加了一个“closeButton”Id，然后使用了下面的代码：

$("#closeButton").click(function () {
    $('body').removeClass('modal-open');
    $('body').css('padding-right', '');
    $(".modal-backdrop").remove();
    $('#thank-you').hide();
});

Bootstrap 模式不会在 Laravel 项目中关闭

Bootstrap modal won't close in Laravel project

javascript

jquery

laravel

bootstrap-modal

bootstrap-4