引导模式不会在 Laravel 项目中关闭答案

【问题标题】：Bootstrap modal won't close in Laravel project引导模式不会在 Laravel 项目中关闭
【发布时间】：2021-09-18 07:00:01
【问题描述】：

我正在做一个 Laravel 项目。提交表单后，如果验证器正常，则会弹出一个引导模式，如下所示。

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

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

在某些情况下，我读到淡入淡出类似乎正在阻止模式关闭，但我不确定这是这里的问题。非常感谢您的帮助。

【问题讨论】：

点击退出模态不关闭？通过按钮？
你可以试试这个<button type="button" class="btn-close" style="float: right;" onclick="$('#thank-you').modal('hide');"></button>
@sta 我试过你的方法，但没有奏效。这似乎是一个简单的问题，但由于某种原因，我花了好几个小时才弄清楚。
@Prospero 是的，点击退出模式会关闭，只是按钮不起作用。
您的开发工具中有错误日志吗？

标签： javascript jquery laravel bootstrap-4 bootstrap-modal

【解决方案1】：

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

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

【讨论】：