獲取artDialog可用頂層頁面window對(duì)象[top]
art.dialog.top默認(rèn)引用的是widnow.top（如果window.top是框架集、跨域、artDialog對(duì)象不存，否則可能為window.parent或者當(dāng)前window）這里頁面所有穿越的對(duì)話框最終是在這個(gè)window上。
var win = art.dialog.top;
win.document.title = '我修改了頁面標(biāo)題';
win.document.getElementById('testInput').value = 'hello world!';
可穿越框架的標(biāo)準(zhǔn)對(duì)話框[through]
如果iframe刷新或者被關(guān)閉，它創(chuàng)建的對(duì)話框會(huì)自動(dòng)回收，防止因內(nèi)存清空而導(dǎo)致錯(cuò)誤。不鼓勵(lì)直接使用window.top.art.dialog()與art.dialog.top.art.dialog()這樣的方式穿越框架，它們會(huì)帶來潛在的錯(cuò)誤。
var throughBox = art.dialog.through;
throughBox({
content: '我是一個(gè)普通的對(duì)話框，只是能穿越框架而已',
lock: true
});
嵌入網(wǎng)頁[open]
同域下能夠自適應(yīng)iframe大小，但chrome 瀏覽器本地運(yùn)行會(huì)認(rèn)為跨域而無法適應(yīng)大小
open方法有如下這幾個(gè)私有個(gè)功能
| 名稱 |
類型 |
描述 |
| iframe內(nèi)部靜態(tài)方法 |
| art.dialog.open.api |
Object |
從iframe頁面引用對(duì)話框擴(kuò)展方法 |
| art.dialog.opener |
object Window |
從iframe頁面引用對(duì)話框觸發(fā)頁面的window |
| 擴(kuò)展方法 |
| iframe |
HTMLElement |
引用open創(chuàng)建的iframe（4.0.1新增） |
其他擴(kuò)展方法：API.html#API
一、使用iframe內(nèi)部腳本控制對(duì)話框
請(qǐng)打開 login_iframe.html 查看源碼
art.dialog.open('login_iframe.html', {title: '提示'});
google maps (示例來自KindEditor)
art.dialog.open('googleMaps.html');
二、在外部對(duì)iframe進(jìn)行控制
對(duì)iframe控制需要用到open私有的this.iframe擴(kuò)展方法：
art.dialog.open('login_iframe_2.html', {
title: '登錄',
init: function () {
var iframe = this.iframe.contentWindow;
var top = art.dialog.top;
var username = iframe.document.getElementById('login-form-username');
username.value = 'guest';
setTimeout(function () {
username.select();
}, 80);
top.document.title = '測(cè)試';
},
ok: function () {
var iframe = this.iframe.contentWindow;
if (!iframe.document.body) {
alert('iframe還沒加載完畢呢')
return false;
};
var form = iframe.document.getElementById('login-form'),
username = iframe.document.getElementById('login-form-username'),
password = iframe.document.getElementById('login-form-password');
if (check(username) && check(password)) form.submit();
return false;
},
cancel: true
});
var check = function (input) {
if (input.value === '') {
inputError(input);
input.focus();
return false;
} else {
return true;
};
};
var inputError = function (input) {
clearTimeout(inputError.timer);
var num = 0;
var fn = function () {
inputError.timer = setTimeout(function () {
input.className = input.className === '' ? 'login-form-error' : '';
if (num === 5) {
input.className === '';
} else {
fn(num ++);
};
}, 150);
};
fn();
};
三、跨域訪問
跨域訪問無法自適應(yīng)大小，也無法進(jìn)行父頁面與子頁面數(shù)據(jù)交換
art.dialog.open('http://www.connect.renren.com/igadget/renren/index.html',
{title: '人人網(wǎng)', width: 320, height: 400});
框架與框架、主頁面數(shù)據(jù)共享[data
& removeData]
框架與框架之間以及與主頁面之間進(jìn)行數(shù)據(jù)交換是非常頭疼的事情，常規(guī)情況下你必須知道框架的名稱才能進(jìn)行數(shù)據(jù)交換，如果是在復(fù)雜的多層框架下操作簡(jiǎn)直就是開發(fā)人員噩夢(mèng)，而這樣的問題在CMS多框架應(yīng)用中十分常見。
在artDialog中這一切完全被簡(jiǎn)化，它有一個(gè)簡(jiǎn)單易用的數(shù)據(jù)共享接口，可以共享任意類型的數(shù)據(jù)供各個(gè)框架頁面讀取，它與頁面名稱、層級(jí)毫無關(guān)系。相關(guān)原理
請(qǐng)打開 iframeA.html
源碼查看范例。由于art.dialog.open方法打開的iframe加劇了框架的層級(jí)的復(fù)雜性，所以請(qǐng)?zhí)貏e重視這個(gè)data方法！
art.dialog.data('test', document.getElementById('demoInput04-3').value);
art.dialog.open('iframeA.html', null, false);
（請(qǐng)輸入測(cè)試文字）
Ajax[load]
特別說明：第三個(gè)參數(shù)為ajax緩存開關(guān)，默認(rèn)為true。由于瀏覽器限制，ajax需要在服務(wù)端運(yùn)行才能正確運(yùn)行本例子。
一、加載網(wǎng)頁片段
art.dialog.load('./ajaxContent/content.html', {
title: '遠(yuǎn)程載入HTML片段',
ok: function(topWin){
art.dialog('hello world');
},
close: function(){
art.dialog.tips('close')
}
}, false);
art.dialog.load('./ajaxContent/login.html', false);
警告消息[alert]
art.dialog.alert('警察叔叔會(huì)請(qǐng)你喝茶！');
確認(rèn)消息[confirm]
art.dialog.confirm('你確認(rèn)刪除操作？', function(){
var top = art.dialog.top,
input = document.getElementById('demoInput02'),
photo = top.document.getElementById('photo');
if (input) input.parentNode.removeChild(input);
if (photo) photo.innerHTML = '<img src="images/lixiaolong.png" />';
}, function(){
art.dialog.tips('你取消了操作');
});
提問消息[prompt]
特別說明：回調(diào)函數(shù)第一個(gè)參數(shù)為輸入的值
art.dialog.prompt('你的名字是什么？', function(data){
var input = document.getElementById('demoInput03'),
topVal = art.dialog.top.document.getElementById('testInput');
if (input) input.value = data;
if (topVal) topVal.value = data;
}, '我是糖餅');
提示消息[tips]
art.dialog.tips('提交成功！', 1.5);
