jquery ui 对话框不会“关闭”

Question

我有一个 jquery 对话框，我想创建 JIT（及时），对我来说，这是迄今为止最优雅的工作方式，但我已经花了大约 2 天的时间来解决这个错误，但我不能我的生活弄清楚了。

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

所以。你能a）帮我解决这个问题吗或b）告诉我如何将取消按钮绑定到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');        
    });     
}