jquery ui 对话框不会 "close"

Question

我有一个 jquery 对话框，我想让 JIT(及时)这对我来说是迄今为止最优雅的工作方式，但是我花了大约 2 天的时间来处理这个错误，但我不能为我的生活弄清楚了。

我知道它应该可以工作，因为角落里的 X 点击效果非常好

所以。你能a)帮我解决这个问题吗？b)告诉我如何将“取消”按钮绑定(bind)到X的单击事件(我以前在出现此类问题时使用过这个技巧，但是这个控件上没有我认为的id)可以找到，现在是使用parents()浏览层次结构的明显方法(我知道如何找到)。

 $(function() {
     var popUrl = 'pop.php?jscriptpopup=true';
     $("#button").click( function () { 
         JQueryDialog(popUrl); 
         return false;
     });        
 });

var dialog;  //<--added in desperation

function JQueryDialog(url){

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

    $("body").append("<div id='dialog'></div>"); 

    dialog = $("#dialog").dialog({
        resizable: false,
        draggable: false,
        width: 770,
        height: 470,
        context: that,
        modal: true,
        autoOpen: false,
        buttons: {
            "Cancel" : function (){
                $(dialog).("close");    //<--this will not work
                                    //$(this).dialog("close"); <<-- hopeless
                                    //$("#dialog").dialog("close"); <<-- hopeless
                                    //$("#dialog").remove(); <<-- hopeless
            }
        }
    });     

    $.get(url, function(data) {
        $("#dialog").html(data);
        $("#dialog").dialog('open');        
    });     
}

Answer 1

在这样做到死后，当我发布的那一刻，我在几秒钟内偶然发现了它 - 通常是这样的

这有效..不知道为什么

function JQueryDialog(url){

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

    $("body").append("<div id='dialog'></div>"); 

    that = $("#dialog");

    dialog = $("#dialog").dialog({
        resizable: false,
        draggable: false,
        width: 770,
        height: 470,
        context: that,
        modal: true,
        autoOpen: false,
        buttons: {
            "Cancel" : function (){
                that.dialog("close");
            }
        }
    });     

    $.get(url, function(data) {
        $("#dialog").html(data);
        $("#dialog").dialog('open');        
    });     
}