结合 jquery 对话框和 jGrowl答案

【问题标题】：Combing jquery dialog & jGrowl结合 jquery 对话框和 jGrowl
【发布时间】：2011-02-20 19:47:46
【问题描述】：

我有一个使用 jquery 对话框确认操作的页面，在执行该操作后，代码将启动对话框的关闭并返回到门户。虽然我的后端将处理所做的操作，但我想使用jGrowl 的不显眼通知来通知用户该操作不成功。但是，使用以下代码，jGrowl 无法执行并在对话框关闭后出现。（我的导入在这个阶段已经完成）我应该把代码放在哪里？

    $("#pop").click(function(){
        $( "#dialog-confirm" ).dialog( "open" );
        return false;
    });

    $( "#dialog-confirm" ).dialog({         
        autoOpen: false,
        resizable: false,
        height:200,

        modal: true,
        buttons: {
            "Drop": function() {
                //ajax
                var checkbox = $("#repost").val();

                $( this ).dialog( "close" );
                $.jGrowl('ACTION SUCCESSFUL!');

            },
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        }


    });

【问题讨论】：

标签： jquery dialog jgrowl

【解决方案1】：

您可以将 jGrowl 的 beforeClose 事件与计时器结合使用。

$.jGrowl('ACTION SUCCESSFUL!', { 
    life: 1000, 
    beforeClose: function(e,m) {
    $( "#dialog-confirm" ).dialog( "close" );
        }
});

jGrowl 的通知应该持续 1000 毫秒，然后关闭对话框。我还没有测试过，但它应该可以工作。

更新：我忘了提到您的 DROP 事件不应该关闭对话框。它应该看起来像这样：

$("#pop").click(function(){
    $( "#dialog-confirm" ).dialog( "open" );
    return false;
});

$( "#dialog-confirm" ).dialog({         
    autoOpen: false,
    resizable: false,
    height:200,

    modal: true,
    buttons: {
        "Drop": function() {
            //ajax
            var checkbox = $("#repost").val();

            // $( this ).dialog( "close" );
    $.jGrowl('ACTION SUCCESSFUL!', { 
        life: 1000, 
        beforeClose: function(e,m) {
        $( "#dialog-confirm" ).dialog( "close" );
            }
    });

        },
        Cancel: function() {
            $( this ).dialog( "close" );
        }
    }


});

【讨论】：