Javascript JQuery错误：初始化之前无法在对话框上调用方法；试图调用方法'；关闭'；

我突然从jQuery中得到这个错误：

错误：初始化前无法在对话框上调用方法；试图调用方法“close”

插件

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script> 

HTML

<div id="dialog" title="Server Response">
  <p><span class="${icon}" style="float: left; margin: 0 7px 50px 0;"></span>
    <label id="results">${results}</label>
  </p>      
</div>

${results}

看起来您的按钮没有正确声明（根据“无论如何”的定义）

请尝试以下操作：

$( ".selector" ).dialog({ 
   buttons: [{ 
      text: "Ok", 
      click: function() { 
         $( this ).dialog( "close" ); 
      }
   }]
});

---

试试这个-它对我有用：

$(".editDialog").on("click", function (e) {
    var url = $(this).attr('href');
    $("#dialog-edit").dialog({
        title: 'Edit Office',
        autoOpen: false,
        resizable: false,
        height: 450,
        width: 380,
        show: { effect: 'drop', direction: "up" },
        modal: true,
        draggable: true,
        open: function (event, ui) {
            $(this).load(url);
        },
        close: function (event, ui) {
            $("#dialog-edit").dialog().dialog('close');
        }
    });

    $("#dialog-edit").dialog('open');
    return false;
});

---

希望它能帮助您

我在1.10.2中遇到了相同的错误。在我的例子中，我想让点击背景覆盖来隐藏当前可见的对话框，不管它基于哪个元素。因此，我有这样的想法：

$('body').on("click", ".ui-widget-overlay", function () {
    $(".ui-dialog").dialog('destroy');
});

这曾经是有效的，所以我想他们一定已经在JQUI中删除了对在某个时候对弹出窗口本身调用.dialog（）的支持

我的解决方法如下所示：

$('body').on("click", ".ui-widget-overlay", function () {
    $('#' + $(".ui-dialog").attr('aria-describedby')).dialog('destroy');
});

function closeDialogWindow() { 
$('#dialogWindow').dialog('close');
}

您的

$（this）.dialog（“close”）

是否有可能从Ajax“success”回调中调用？如果是这样，请尝试添加

上下文：这是
$.ajax（）
调用的选项之一，如下所示：

$("#dialog").dialog({
    modal: true,
    buttons: {
        Ok: function() {
            $.ajax({
                url: '/path/to/request/url',
                context: this,
                success: function(data)
                {
                    /* Calls involving $(this) will now reference 
                       your "#dialog" element. */
                    $(this).dialog( "close" );
                }
            });
        }
    }
});

我有一个类似的问题，我通过在对话框声明之外定义我的按钮数组来解决

var buttonArray={}；
buttonArray[“Ok”]=函数（）{$（this）.dialog（“close”）；}

你的选择将是：

modal:true，
自动打开：错误，
按钮：buttonArray
一个小时后，我找到了最好的方法。
我们应该将对话框的结果保存在变量中，然后调用变量的close方法

像这样：

var dd= $("#divDialog")
.dialog({
   height: 600,
   width: 600,
   modal: true,
   draggable: false,
   resizable: false
});

// . . .

dd.dialog('close');

在asp.net MVC中打开带有部分布局的对话框时，我遇到了类似的问题。我在部分页面和主页上加载jquery库，导致出现此错误。
我也遇到了相同的错误：初始化之前无法调用对话框上的方法；试图调用方法“close”

我所做的是触发了对话框标题中的close button事件
像

关闭对话框对我来说效果很好

function btnClose() {
$(".ui-dialog-titlebar-close").trigger('click');
}

我也遇到了同样的问题，想与大家分享我的解决方案：

<script type="text/javascript">
    $( "#dialog-confirm" ).dialog("option","buttons",
                {
                    "delete": function() {
                        $.ajax({
                            url: "delete.php"
                        }).done(function(msg) {
                         //here "this" is the ajax object                                       
                            $(this).dialog( "close" );
                        });

                    },
                    "cancel": function() {
                        //here, "this" is correctly the dialog object
                        $(this).dialog( "close" );
                    }
                });
</script>


$（“#对话框确认”）。对话框（“选项”、“按钮”，
{
“删除”：函数（）{
$.ajax({
url:“delete.php”
}).done（函数（msg）{
//这里的“this”是ajax对象
$（此）.dialog（“关闭”）；
});
},
“取消”：函数（）{
//这里，“this”是正确的对话框对象
$（此）.dialog（“关闭”）；
}
});

因为“this”引用的是非对话对象，所以我得到了上面提到的错误

解决方案：

<script type="text/javascript">
    var theDialog = $( "#dialog-confirm" ).dialog("option","buttons",
                {
                    "delete": function() {
                        $.ajax({
                            url: "delete.php"
                        }).done(function(msg) {
                            $(theDialog).dialog( "close" );
                        });

                    },
                    "cancel": function() {
                        $(this).dialog( "close" );
                    }
                });
</script>


变量对话框=$（“#对话框确认”）。对话框（“选项”、“按钮”，
{
“删除”：函数（）{
$.ajax({
url:“delete.php”
}).done（函数（msg）{
$（对话框）。对话框（“关闭”）；
});
},
“取消”：函数（）{
$（此）.dialog（“关闭”）；
}
});
我曾经遇到过这个问题，其中一个对话框抛出了这个错误，而其他所有对话框都工作正常。答案是因为页面上有另一个元素具有相同的
id=“dialogBox”
else-ware。我在搜索过程中发现了此线程，希望它能帮助其他人。
因此您可以使用此线程：

var opt = {
        autoOpen: false,
        modal: true,
        width: 550,
        height:650,
        title: 'Details'
};

var theDialog = $("#divDialog").dialog(opt);
theDialog.dialog("open");

如果在对话框中打开MVC局部视图，则可以在索引中创建隐藏按钮和JQUERY click事件：

$("#YourButton").click(function()
{
   theDialog.dialog("open");
   OR
   theDialog.dialog("close");
});

然后在部分视图html中调用按钮触发单击，如下所示：

$("#YouButton").trigger("click")

请参见。
这发生在我身上，当时我的ajax正在替换页面上的内容，并以对话框中同一类的两个元素结束，这意味着当我基于CSS类选择器执行关闭对话框的命令时，它发现两个元素不是一个，第二个元素从未初始化

$(".dialogClass").dialog("close"); //This line was expecting to find one element but found two where the second had not been initialised.

对于ASP.NET MVC上的任何人来说，之所以发生这种情况，是因为我的控制器操作返回了一个完整视图，包括共享布局页面，该页面中的元素本应返回部分视图，因为javascript只替换了主内容区域。
出于某种原因，jQuery UI似乎会尝试运行按钮中定义的所有代码在定义时间。这是疯狂的，但我有同样的问题，一旦我做了这个改变，它就停止了

if ($(this).dialog.isOpen === true) { 
    $(this).dialog("close");
}

当我试图使用对话框主体内的按钮关闭对话框时，收到了此错误消息。我试图使用
$（'#myDialog'）.dialog（'close'）不起作用

最后，我使用以下命令触发标题上“x”按钮的单击操作：

$('.modal-header:first').find('button:first').click();  

森古图万：你的解决方案是唯一对我有效的

函数btnClose（）{

$（“.ui对话框标题栏关闭”）.trigger（'click'）；

}

我也有同样的问题，我打开了几个对话框我的问题是应该删除哪些内容以防止表单数据保留在相同的数据中，然后创建这些参数的对话框

var dialog = $("#dummy-1");

    dialog.html('<div style="position:absolute; top:15px; left:0px; right:0px; bottom:0px; text-align:center;"><img align="middle" src="cargando.gif"></div>');
    dialog.html(mensaje);
    dialog.dialog(
    {
        title:'Ventana de Confirmacion',
        width:400, 
        height:200, 
        modal:true,
        resizable: false,
        draggable:false,
        position: { my: "center center", at: "center center", of: window },
        buttons:
        [
            {
                text: "Eliminar",
                click: function() {
                    functionCall(dialog,var1,var2);
                }
            },
            {
                text: "Cerrar",
                click: function() {
                    dialog.dialog("close");
                }
            }
        ],
        close: function(event, ui)
        {
            dialog.dialog("close").dialog("destroy").remove();
        }
    });

}

这里只需要使用.dialog（“close”）和no.dialog（“destroy”），因为对话框将调用其函数close:并且元素将不存在
我有一个类似的问题，在我的情况下，问题是不同的（我使用的是Django模板）

JS的顺序是不同的（我知道这是你检查的第一件事，但我几乎肯定不是这样的，但事实确实如此）。调用对话框的js在调用jqueryUI库之前被调用

我使用的是Django，所以我继承了一个模板，并使用{super.block}从块继承代码
    function functionCall(dialogFormulario,var1,var2)
{
    //same action 
        dialogFormulario.dialog("close");

function closeDialogWindow() { 
$('#dialogWindow').dialog('close');
}

var closeFunction = function() {
    $(#dialog).dialog( "close" );
};

$('#dialog').dialog({
    modal: true,
    buttons: {
        Ok: closeFunction
    }
});

if($('#mydialog').dialog('isOpen')) { //close dialog code}