jquery - 关闭 Laravel 中的 Bootstrap 模态窗口

Question

我正在弹出 Bootstrap 模式窗口，其中包含存储的 session 数据，但我无法关闭它。我必须将“show”类添加到 div 中才能使其出现。

 @if (Session::has('message'))
<script type="text/javascript">
    $(window).load(function() {
        $('#confirm').modal('show');

    });

</script>
<div class="modal show" id="confirm"> 
    <div class="modal-dialog">
        <div class="modal-content">   
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span>&times;</span><span class="sr-only">Close</span></button>
                <h4>{{ Session::get('message') }}</h4>
            </div>
            <div class="modal-body">
                <p>You are now signed up for our newsletter.</p>
            </div>
        </div>
    </div>



</div>
@endif

Answer 1

通过调用 $('#confirm').modal('show')，您的模式应该可以正常显示，因此请检查您的浏览器控制台是否有任何 JavaScript 错误。至于关闭它也同样简单:

$('#confirm').modal('hide');

下面是一个在加载时自动打开它并在等待 5 秒后关闭它的示例:http://jsfiddle.net/7wt719p3/1/

编辑

确保在 Bootstrap JS 插件文件之前加载 jQuery。 Bootstrap 需要 jQuery 才能使其插件(如模态)正常工作。以下是使用 CDN 包含它的方法:

<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>