Question

我的页面中有2个模态。当调用第二模态时，两者都将打开。怎么了？

<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Modal Header</h4>
            </div>
            <div class="modal-body">
                <p>Modal Body</p>
                <button type="button" class="btn btn-default" data-dismiss="modal" href="otherpage.php">Continue</button>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal" href="otherpage.php">Close</button>
            </div>
        </div>
    </div>
</div>      

<div id="modal2" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Modal Header</h4>
            </div>
            <div class="modal-body">
                <p>Modal Body</p>
                <button type="button" class="btn btn-default" data-dismiss="modal" href="otherpage.php">Continue</button>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal" href="otherpage.php">Close</button>
            </div>
        </div>
    </div>
</div>

我正在加载bootstrap并且我使用此功能调用第二个模态

$('#modal2').modal('show');

调用此函数时，第一个模态也会出现。怎么了？因为我希望只显示第二个模态。

Answer 1

答案由@Josh Crozier提供。

我的custom.js代码中有一些其他依赖项，下面的函数触发了另一个模态。我没有意识到这一点。

$(window).on('shown.bs.modal', function() {
    $('#myModal').modal('show');
});

感谢您的帮助！

使用jquery时打开2个模态

1 个答案: