jQuery Dialog API (一)

1. 将调用页面的值传到窗口中

/* 方式一 在内容页里写代码取值 */
/* 下面的代码为内容页value01.html页面里的代码，请自行打开此文件查看代码 */
var api = frameElement.api, W = api.opener;
window.onload = function()
{
    document.getElementById('itxt').value = W.document.getElementById('txt1').value;
};
------------------------------------------------------
/* 方式二 在调用窗口代码里使用init参数写入值 */
/* 下面的代码为 运行2 按钮调用窗口组件的代码 */
$('#demo_02').dialog({
    content:'url:value/value02.html',
    init:function(){
        /* this.iwin 为窗口内容页的window对象 */
        this.iwin.document.getElementById('itxt').value = document.getElementById('txt1').value;
    }
});
------------------------------------------------------
/* 方式三 在调用窗口代码里使用data参数来传入值 */
/* 下面的代码为 运行3 按钮调用窗口组件的代码 */
$('#demo_02').dialog({
    content:'url:value/value02.html',
    data:document.getElementById('txt1').value;
});
/* 下面的代码为内容页value03.html页面里的代码，请自行打开此文件查看代码 */
var api = frameElement.api;
window.onload = function()
{
    document.getElementById('itxt').value = api.data;
};


调用组件页面中文本框的值

 
将窗口中的值传回到调用页面中
注：实现的方法也有很多种，请自行尝试
/* 下面的代码为内容页value04.html页面里的代码，请自行打开此文件查看代码 */
var api = frameElement.api, W = api.opener;
api.button({
    id:'valueOk',
    name:'确定',
    callback:ok
});
/* 函数ok即为上面添加按钮方法中callback回调函数调用的函数 */
function ok()
{
    W.document.getElementById('txt2').value = document.getElementById('itxt').value;
};



在调用页面调用窗口B中的值或函数
注：实现的方法也有很多种，请自行尝试
/* 下面的代码为：“调用B窗口中文本框的值” 按钮所调用的函数的代码 */
function getValue1()
{
    if( !demoDG1 || demoDG1.closed )
        alert( '请先打开B窗口' );
    else // demoDG1.content 为B窗口内容页面的window对象
        alert( demoDG1.content.document.getElementById('itxt').value );
};
------------------------------------------------------
/* 下面的代码为：“调用B窗口的函数” 按钮所调用的函数的代码 */
function getFunc1()
{
    if( !demoDG1 || demoDG1.closed )
        alert( '请先打开B窗口' );
    else // demoDG1.content 为B窗口内容页面的window对象 BB()为B窗口内容页中的一个函数
        demoDG1.content.BB();
};
打开B窗口» 调用B窗口中文本框的值» 调用B窗口的函数»
在调用页面调用窗口B中的值或函数
注：实现的方法也有很多种，请自行尝试
/* 下面的代码为内容页value06.html页面里的代码，请自行打开此文件查看代码 */
var api = frameElement.api, W = api.opener;
// getValue函数为内容页value06.html页面里的“组件调用页面文本框的值” 按钮所调用的函数
function getValue()
{
    alert( W.document.getElementById('txt3').value );
};
// 下面的代码为内容页value06.html页面里“组件调用页面的函数” 按钮单击事件所调用的函数
W.AA();


lhgdialog组件调用页面文本框
 打开B窗口»
在调用页面调用C窗口(也就是B窗口的子窗口)的值或函数
注：实现的方法也有很多种，请自行尝试
/* 方式一 直接使用js原生方法来实现 */
function getValue2()
{
    // demoDG2.content 为B窗口内容页的window对象
    if( !demoDG2 || !demoDG2.content.cDG || demoDG2.content.cDG.closed )
        alert( '请先打开C窗口' );
    else // demoDG2.content.cDG 为B窗口中调用C窗口的实例对象 demoDG2.content.cDG.content 即为C窗口内容页的window对象
        alert( demoDG2.content.cDG.content.document.getElementById('itxt').value );
};
function getFunc2()
{
    if( !demoDG2 || !demoDG2.content.cDG || demoDG2.content.cDG.closed )
        alert( '请先打开C窗口' );
    else
        demoDG2.content.cDG.content.CC();
};
------------------------------------------------------
/* 方式二 通过窗口的id参数来实现 （推荐使用这种方法来实现，这种方法更直观，更易理解） */
function getValue3()
{
    /* 通过$.dialog.list['id']对象来获取C窗口的实例对象，其中的id即为创建C窗口的id
    if( !$.dialog.list['demo_c'] || $.dialog.list['demo_c'].closed )
        alert( '请先打开C窗口' );
    else
        alert( $.dialog.list['demo_c'].content.document.getElementById('itxt').value );
    */
        
// 通过内部的get('id')方法来获取C窗口内容页window对象，其中的id即为创建C窗口的id（最推荐使用的方法）
// get方法有2个参数get('id',1)其中第二个参数只有为数字1时返回窗口实例对象，如不写或为其它任何值都返回窗口内容页的window对象
    if( !demoDG2 || !demoDG2.get('demo_c') )
        alert( '请先打开C窗口' );
    else
        alert( demoDG2.get('demo_c').document.getElementById('itxt').value );
};
function getFunc3()
{
    /*
    if( !$.dialog.list['demo_c'] || $.dialog.list['demo_c'].closed )
        alert( '请先打开C窗口' );
    else
        $.dialog.list['demo_c'].content.CC();
    */
    // 演示示例都是使用的get内部方法来实现的
    if( !demoDG2 || !demoDG2.get('demo_c') )
        alert( '请先打开C窗口' );
    else
        demoDG2.get('demo_c').CC();
};
打开B窗口» 调用C窗口中文本框的值(方式一)» 调用c窗口的函数(方式一)»
调用C窗口中文本框的值(方式二)» 调用c窗口的函数(方式二)»
在C窗口(也就是B窗口的子窗口)中调用组件调用页面中的值或函数
注：实现的方法也有很多种，请自行尝试
/* 下面的代码为内容页value10.html页面里的代码，请自行打开此文件查看代码 */
var api = frameElement.api, W = api.opener;
// getValue函数为内容页value10.html页面里的“组件调用页面文本框的值” 按钮所调用的函数
function getValue()
{
    alert( W.document.getElementById('txt4').value );
};
// 下面的代码为内容页value10.html页面里“组件调用页面的函数” 按钮单击事件所调用的函数

W.AA();

转载至：http://www.lhgdialog.com/value/