从另一个模态打开一个模态，然后关闭第一个(启动)模态 [英] Open a Modal from another modal and close the first (launching) modal

问题描述

我正在使用Bootstrap Modal Window插件，它的工作正常，但是当我单击下一步"并关闭第一个模型窗口时，我想打开另一个模型窗口.我该怎么办?

I'm using Bootstrap Modal Window plugin its work fine but i would like to open another model window when i click next and close first one. how can i do it?

$('[data-toggle="modal"]').click(function(e) 
    {
        e.preventDefault();
        var url = $(this).attr('href');
        if (url.indexOf('#') == 0)
        {
            $(url).modal('open');
        } 
        else 
        {
            $.get(url, function(data) 
            {
                $(data).modal();
            }).success(function() { $('input:text:visible:first').focus(); });
        }
    });

<a href="next.html" data-toggle="modal">Add Record</a>

next.html文件代码

next.html File Code

<div class="modal fade" id="compose-modal" role="dialog" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">First Window</h4>
            </div>
            <form action="#" method="post">

                <div class="modal-footer clearfix">
                    <button type="button" data-dismiss="modal">Discard</button>

                    <button type="submit">Submit</button>
                     <a href="next2.html" data-toggle="modal" >Next</a>
                </div>
            </form>
        </div>
    </div>
</div>

推荐答案

下面提供了更多更新的答案: https://stackoverflow .com/a/44391959/1004312

A more updated answer is found below: https://stackoverflow.com/a/44391959/1004312

您正在从另一个模态中打开一个模态，然后关闭第一个模态.如果您使用的是Bootstrap 3，则可以执行以下操作:

You are opening a modal from another modal and closing the first. If you're using Bootstrap 3, you can do the following:

演示: http://jsbin.com/venek/1/edit

DEMO: http://jsbin.com/venek/1/edit

在第一个模态中，将链接链接到下一个模态(#modal-1和#modal-2是示例ID)

In the first modal put the link to the next modal (#modal-1 & #modal-2 are example ids)

  <a href="#modal-2" data-toggle="modal" data-dismiss="modal">Next</a>

在第二个模式中，将链接指向第一个:

In the second modal put the link to the first:

  <a href="#modal-1" data-toggle="modal" data-dismiss="modal">Previous</a>

演示: http://jsbin.com/venek/1/edit

DEMO: http://jsbin.com/venek/1/edit

这篇关于从另一个模态打开一个模态，然后关闭第一个(启动)模态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！