Question

这是问题所在，我正在使用jquery插件运行完整的ajax webapp但是在关闭对话框后我无法重新初始化。

function edit()
{
$("#dialog").dialog({
    modal: true,
    resizable: false,
    autoOpen: false,
    buttons: {
        'Save' : function(){
                // Some function here.
        },
        'Close' : function(){
            $("#dialog").dialog('destroy');
        }
    }
});
}

该对话框由一个按钮调用，它所做的就是调用上面的函数edit（）

我尝试过这些方法：

情景1：

我单击按钮进行编辑，然后我决定使用关闭按钮关闭弹出窗口（而不是顶部的x按钮），对话框关闭。当我再次单击该按钮时，对话框打开但是现在当我尝试关闭我必须单击两次，因为两个对话框实例显然正在运行。

情景2：

当我想出要避免两个实例时我必须使用

$("#dialog").dialog('close').remove();

而不是

$("#dialog").dialog('close');

这解决了多实例问题，但现在我无法打开对话框，除非我刷新页面，有关如何解决的任何想法？

Answer 1

从edit（）函数中删除对话框的初始化。单独初始化对话框，然后分别打开或关闭每个按钮的单击处理程序。每次调用.dialog时，你都要实例化另一个对话框 - 只需实例化一次并自动隐藏它（你当前正在使用autoOpen设置为false），然后在想要打开或关闭它时传递打开或关闭对话框。请参阅此documentation。

Answer 2

在此处使用id对话框删除元素：

$("#dialog").dialog('close').remove();

您应该在编辑函数中确保在调用.dialog（）之前存在#dialog。例如：

if( ! $('#dialog').length ) {
     $('body').append('<div id="dialog"></div>');
}

Answer 3

在edit（）函数之外创建对话框。一旦调用dialog（），该元素就会变成一个对话框。

在edit（）函数中，您只需使用$('#dialog').dialog('open');

编辑：添加数据传递

$("#dialog").dialog({
    modal: true,
    resizable: false,
    autoOpen: false,
    buttons: {
        'Save' : function(){
            $('#dialog').data('param1');
            $('#dialog').data('param2');
        },
        'Close' : function(){
            $("#dialog").dialog('close');
        }
    }
});

function edit(somevalue1, somevalue2){
   $('dialog').data('param1', somevalue1);
   $('dialog').data('param2', somevalue2);
   $('dialog').dialog('open');
}

Answer 4

您可以尝试使用clone()。这样的事情可以帮助：

var dialog = $("#dialog").clone()
dialog.dialog({...})

Answer 5

我认为您应该使用以下代码初始化该对话框：

$("#dialog").dialog({    
        modal: true,    
        resizable: false,    
        autoOpen: false,    
        buttons: {        
           'Save' : function(){ // Some function here. },
           'Close' : function(){ $("#dialog").dialog('close');
        }    
}});

然后编辑代码：

function edit(){
     $("#dialog").dialog('open');
}

希望它对你有用~~~祝福

初始化jquery对话框

5 个答案: