BB 对话框出现在警报之前

BB Dialog showing up before alert

JSFiddle Link:

bootbox.alert 应该出现在 bootbox.dialog 之前。我已经将所有库预加载到 JSFiddle 中。我希望 bootbox.dialogbootbox.alert 被点击后显示。

看看here

Bootbox 定义了它们的函数 here,如您所见,它们包含一个回调。例如:

bootbox.alert(message, callback)

callback 使您可以选择仅 运行 此行完成后的某些代码。这解决了你的问题。

JS

$(document).ready(function () {
    $('.begin-game').click(function () {
        bootbox.alert("This should show up first", function () {
            bootbox.dialog({
                message: "Did you pass Go?",
                title: "This should go second / last",
                buttons: {
                    // Passed go
                    success: {
                        label: "Yes I Passed GO!",
                        className: "btn-success",
                        callback: function () {

                        }
                    },
                    // Did not pass go
                    danger: {
                        label: "I did not :(",
                        className: "btn-danger",
                        callback: function () {

                        }
                    },
                }
            });
        });
    });
});

bootbox.alert 的第二个参数是 function,将在警报解除后调用。在该函数中启动对话框。

$(document).ready(function() {
    $('.begin-game').click(function () {
        bootbox.alert("This should show up first", showDialog);

        function showDialog() {
            bootbox.dialog({
                message: "Did you pass Go?",
                title: "This should go second / last",
                buttons: {
                    // Passed go
                    success: {
                        label: "Yes I Passed GO!",
                        className: "btn-success",
                        callback: function() {

                        }
                    },
                    // Did not pass go
                    danger: {
                        label: "I did not :(",
                        className: "btn-danger",
                        callback: function() {

                        }
                    }
                }
            });        
        }
    });
});