Javascript jQueryUI对话框-更改打开对话框的内容（Ajax）

我想在jQuery UI对话框中使用

jQuery.load（）

动态打开一些链接。对话框打开后，我希望链接加载到已经打开的对话框中

因此，站点加载后，单击一个链接，它将在一个对话框中打开。那很好。您可以根据需要多次关闭和打开它

当它打开时，如果您单击加载内容中的一个链接，它将不起作用。

• 执行GET请求，但结果内容未成功加载到对话框中。（显示请求）
• 上一个对话框标题和对话框内容将被删除。但新内容不会显示，也不会插入到DOM中。（生成的源不会在任何位置显示内容。）

链接看起来像这样

<a href="http://www.example.com/index.php?action=something&amp;search=somethingelse#fragment" rel="dialog" title="Title Attribute">

ajax\u对话框

函数检查是否有对话框，如果没有，则调用创建对话框，调用加载内容，设置标题，如果对话框未打开，则打开对话框

function ajax_dialog(_this, _event){
    var urlToLoad = $(_this).attr("href").replace("#", "&ajax=true #");
    var linkTitle = $(_this).attr("title");

    // Create dialog
    if(!$('body').find('#ajaxDialog').size()){
        $('body').append('not yet init<br />'); // This shows up the first click only.
        init_dialog('#ajaxDialog');
    }

    // Load Dialog Content
    load_dialog('#ajaxDialog', urlToLoad);

    // Add title
    $('#ajaxDialog').dialog('option', 'title', linkTitle);

    // Open dialog (or reload)
    if(!$('#ajaxDialog').dialog('isOpen')){
        $('#ajaxDialog').dialog('open');
        $('body').append('not yet open<br />'); // This shows up the first click only.
    }
    return false;
}

load_对话框

功能将所需内容加载到对话框中

function load_dialog(_this, urlToLoad){
    $(_this).load(urlToLoad, function(){
        $('body').append(urlToLoad + ' load function<br />'); // This shows up each click
        $(_this).append("Hihi?"); // This shows up each click
    });
    // The loaded information only shows the first click, other times show an empty dialog.
}

函数加载对话框（\u this，urltoad）{
$（_this）.load（urlToLoad，function（）{
$（'body'）.append（urltoad+'load function
）；//每次单击都会显示此选项
$（\u this）.append（“Hihi？”）；//每次单击都会显示此选项
});
//加载的信息仅显示第一次单击，其他时间显示空对话框。
}

哈哈。如代码所示，我使用了

$jQuery.load（）

并将链接的确切

href

作为to请求。所有URL的末尾都有片段/锚点，即：…

html#id of div

在本例中，脚本本身工作正常，但页面上还不存在div的#id。这就是为什么我可以看到返回的内容，但对话框却变成了空白。：-）

function init_dialog(_this){
    $('body').append('<div id="ajaxDialog"></div>');
    // Set Dialog Options
    $(_this).dialog({
        modal:true,
        autoOpen:false,
        width:900,
        height:400,
        position:['center','center'],
        zIndex: 9999,
        //open:function(){load_dialog(this, urlToLoad);}, This didn't work without destroying the dialog for each click.
        close:function(){$(this).empty();}
    });
}

function load_dialog(_this, urlToLoad){
    $(_this).load(urlToLoad, function(){
        $('body').append(urlToLoad + ' load function<br />'); // This shows up each click
        $(_this).append("Hihi?"); // This shows up each click
    });
    // The loaded information only shows the first click, other times show an empty dialog.
}