Javascript 如何在每个连续模态中单击按钮时显示多个模态

我试图在页面上添加多个对话框，然后在用户单击每个对话框中的OK按钮时显示第一个和后续对话框。我离得很近，但不太管用。我的问题是，我不确定如何关闭单击的模式，然后依次显示下一个模式。非常感谢您的帮助

谢谢

加价

<div class="mymodal" style="display: none">
    <!-- inject modal content into here -->
</div>

javascript代码

(function(ns) {

  var modalArray = [];

  ns.calculateWhatModalsWeNeed = function () {

    $.ajax({
        url: serviceUrl,
        cache: 'testurl',
        data: myData,
        type: 'post',
        success: function (data) {
            // based on the response an array is built up
            // i.e.
            modalArray.push('modal1');
            modalArray.push('modal2');

            ns.loadModals(modalArray, ns.showModal());  
        },
        dataType: 'json',
        contentType: "application/json; charset=utf-8"
    });

  };

  ns.loadModals = function(modalsToShow, callback) {

    // call and load the modal mark up into the DOM
    for (var i = 0; i < modalsToShow.length; i++) {

        var successCallBack = function (html) {
            $('.mymodal').append(html);
        };

        // Load modal window onto page
        var modalUrl = 'myurl' + modalsToShow[i];

        // ajax command to call the mvc controller
        // the modalsToShow array are the view names
        // i.e. 'myurl' + '/' + modalsToShow[i];

        ajaxcommand.get(...);
    }

    if (callback && typeof (callback) === 'function') callback();

};

ns.showModal = function () {

    // this is the problem i think - how to 
    // trigger each modal here as you click okay on each one..?

    $('mymodal:first').dialog({
        width: 633,
        closeOnEscape: true,
        modal: true
    });
};

})(namespace('stackoverflow.problem'));

（函数（ns）{
var modalArray=[]；
ns.calculateWhatModalsWeNeed=函数（）{
$.ajax({
url:serviceUrl，
缓存：“testurl”，
数据：myData，
键入：“post”，
成功：功能（数据）{
//根据响应建立一个数组
//即。
modalArray.push（'modal1'）；
modalArray.push（'modal2'）；
ns.loadModals（modalArray，ns.showModal（））；
},
数据类型：“json”，
contentType:“应用程序/json；字符集=utf-8”
});
};
ns.loadModals=函数（modalsToShow，回调）{
//调用模态标记并将其加载到DOM中
对于（var i=0；i

您将希望在对话框中使用事件

$('mymodal:first').dialog({
    width: 633,
    closeOnEscape: true,
    modal: true,
    close: function(event, ui) {
        // do something...    
    }
});

您还可以像这样绑定事件侦听器：

$( ".selector" ).on( "dialogclose", function( event, ui ) {} );

---

另一方面，您在

mymodal

类之前缺少了一个

。

那么剩下的代码看起来还可以吗？感谢您的快速回复，我不太确定您的意图，但是如果您想要一个无限的模态序列，您可以简单地在close事件上执行ajax调用，然后通过ajax请求的成功回调触发open。如果您需要在某个点停止，可以在打开modals之前检查一些内容。希望有帮助。我打电话给一个服务，返回我需要显示的模态，即car.cshtml、plane.cshtml、ship.cshtml等。。服务的回报可以是其中任何一项，也可以是全部。然后我需要实际调用这些modals的URL，将modals注入页面。在此之后，我需要显示第一个模态，即car.cshtml。模态上有一个OK按钮。当用户单击OK按钮时，它需要关闭，然后显示下一个模式，即car.cshtml。希望helpsI已尝试关闭事件，但我不确定如何正确触发第一个模态的关闭？我尝试关闭所有模态