Javascript 单击一个按钮关闭一个模式,然后打开另一个。(SimpleModel)

Javascript 单击一个按钮关闭一个模式,然后打开另一个。(SimpleModel),javascript,jquery,modal-dialog,simplemodal,Javascript,Jquery,Modal Dialog,Simplemodal,因此,我有一个带有几个按钮的标题,我想要的功能是: 按下一个按钮,下拉菜单显示 按下另一个按钮,该模式消失,另一个立即打开 有没有办法做到这一点?目前我有$.modal.close;在内容打开之前,因此内容仍会打开,但它会自动触发onClose事件,阻止它打开其他模式 var content; jQuery(function ($) { var OSX = { container: null, init: function () {

因此,我有一个带有几个按钮的标题,我想要的功能是:

按下一个按钮,下拉菜单显示

按下另一个按钮,该模式消失,另一个立即打开

有没有办法做到这一点?目前我有$.modal.close;在内容打开之前,因此内容仍会打开,但它会自动触发onClose事件,阻止它打开其他模式

var content;
jQuery(function ($) {
    var OSX = {
        container: null,
        init: function () {
            $(".buttonOne,").click(function (e) {
                e.preventDefault(); 

                $.modal.close();


                content = "#osx-modal-content-ONE";

                $(content).modal({
                    overlayId: 'osx-overlay',
                    containerId: 'osx-container',
                    closeHTML: null,
                    minHeight: 80,
                    maxHeight:599,
                    opacity: 65, 
                    position: ['60px',],
                    overlayClose: true,
                    onOpen: OSX.open,
                    onClose: OSX.close

                });

            });

            $(".buttonTWO,").click(function (e) {
                e.preventDefault();

                $.modal.close();

                content = "#osx-modal-content-TWO"; 

                $(content).modal({
                    overlayId: 'osx-overlay',
                    containerId: 'osx-container',
                    closeHTML: null,
                    minHeight: 80,
                    maxHeight:599,
                    opacity: 65, 
                    position: ['60px',],
                    overlayClose: true,
                    onOpen: OSX.open,
                    onClose: OSX.close

                });

            });


        },
        open: function (d) {

            var self = this;
            self.container = d.container[0];
            $("#osx-overlay").css("top","60px");

            d.overlay.fadeIn('fast', function () {


                d.container.slideDown('fast', function () {
                    setTimeout(function () {

               $(content, self.container).show();


                var title = $("#osx-modal-title", self.container);
                title.show();

                        var h = $("#osx-modal-data", self.container).height()
                            + title.height()
                            + 20; // padding
                        d.container.animate(
                            {height: h}, 
                            0,
                            function () {
                                $("div.close", self.container).show();
                                $("#osx-modal-data", self.container).show();

                            }
                        );
                    }, 0);
                });
            })
        },
        close: function (d) {

            var self = this; // this = SimpleModal object
            d.container.animate(
                {top:"-" + (d.container.height() + 20)},
                200,
                function () {
                    self.close(); // or $.modal.close();


                }
            );



        }
    };

    OSX.init();

});

你有一个活生生的例子,我们可以看看吗?不幸的是,没有,我只是在一个巨大的项目运行这一切,但这是一个单一的页面。加上它的主干+require.js,所以我不能简单地建立一个html+js文件=/我不完全理解您的问题,但您可以使用close事件打开第二个对话框,我测试了该逻辑,并且似乎可以工作,至少在我的小场景中是这样。您可以在此处查看该示例: