几秒钟后自动隐藏对话框

Question

我读过很多关于如何在几秒钟后以多种方式隐藏对话框的答案。然而，我不能得到这个工作与我的例子。

我正在使用一个opencart插件，当你在购物车中添加一个产品后会显示一个DIV，但它会一直保持在那里，只有当用户点击“继续购物”时才会关闭。我希望这个DIV在5秒后自动关闭。

我已经尝试setTimeout，延迟等，没有工作......所以我不确定我做错了什么：

代码是这样的：

$('#cart-total').html(json['total']); 
$('<div id="slidecart-success">'+json["confirmation"]+'</div>').
    dialog({
        autoOpen : true,
        modal: true,
        width : 480,
        resizable: false,                   
        title : cart_title,
        buttons: [{
            text: cart_checkout,
            click: function() { location = 'index.php?route=checkout/simplecheckout'; }
        },{
            text: pop_continue,
            click: function() { $(this).dialog("close"); }
        }],                 
        dialogClass: "slidecart-success",
        create:function(){
            $("#slidecart-success-confirm").bind("click", 
                function(){
                    $('#slidecart-success').dialog('close');
                }
            );
        },
        close: function(){
            $("#slidecart-success-confirm").unbind("click"); 
            $('#slidecart-success').remove();
        }
    });         

有人能帮我吗？

编辑：

我也在尝试，但没有成功：

if (json['success']) {

                $('#cart-total').html(json['total']);
// Start edit by Best-Byte //   
                $('<div id="slidecart-success">'+json["confirmation"]+'</div>').
                dialog({
                    autoOpen : true,
                    modal: true,
                    width : 480,
                    resizable: false,
                    title : cart_title,
          buttons: [{

        text: cart_checkout,
        click: function() { location = 'index.php?route=checkout/simplecheckout'; }
      },{
        text: pop_continue,
        click: function() { $(this).dialog("close"); }
      }
      ],                    
                    dialogClass: "slidecart-success",
                    create:function(){
                        setTimeout(function(){
    $("#slidecart-success-confirm").click();
}, 5000);
                        $("#slidecart-success-confirm").live("click", 
                            function(){
                                $('#slidecart-success').dialog('close');
                            }
                        );
                    },

Answer 1

如果您不打算取消自动关闭，请尝试此代码

var dialog = $("<div/>", {
    id: "slidecart-success"
    html: json.confirmation
}).dialog({
    autoOpen : true,
    modal: true,
    width : 480,
    resizable: false,                   
    title : cart_title,
    buttons: [{
        text: cart_checkout,
        click: function() { location = "index.php?route=checkout/simplecheckout"; }
    },{
        text: pop_continue,
        click: function() { $(this).dialog("close"); }
    }],                  
    dialogClass: "slidecart-success",
    open: function() { 
        setTimeout(function(){
            dialog.dialog("close");
        }, 5000);
    }, 
    close: function() {
        // its better to destroy dialog rather than remove node 
        dialog.destroy();
    }
}); 

// you can move this to outer scope 
// and it will close any opened dialog
$("#slidecart-success-confirm").on("click",function(){
    dialog && dialog.dialog("close");
});

Answer 2

这个怎么样：

$('#cart-total').html(json['total']); 
$('<div id="slidecart-success">'+json["confirmation"]+'</div>').
    dialog({ /* ... */ });

setTimeout(function(){
    $("#slidecart-success-confirm").click();
}, 5000);

这仅在5秒超时后调用确认按钮上的单击事件。。。

编辑：

尝试更改绑定函数与live为该$（"#幻灯片-成功-确认"）按钮，同时使用该setTimeout从上面：

$("#slidecart-success-confirm").live("click", 
    function(){
        $('#slidecart-success').dialog('close');
    }
);

通过live函数，我们告诉新创建的元素（不是在DOM中构建的），根据选择器也响应该事件（在我们的例子中，单击）。试试这个，如果不起作用，我想我没办法了...