警告消息

art.dialog.alert('警察叔叔会请你喝茶!');

确认消息

art.dialog.confirm('你确认删除操作?', function(topWin){
	var input = document.getElementById('demoInput02');
    if (input) input.parentNode.removeChild(input);
}, function(){
	alert('你取消了操作');
});

提问消息

特别说明:回调函数第一个参数为输入的值,第二个为顶级页面window对象

art.dialog.prompt('你的名字是什么?', function(data, topWin){
	// data 代表输入数据;
	var input = document.getElementById('demoInput03'),
		topVal = topWin.document.getElementById('testInput');
	if (input) input.value = data;
	if (topVal) topVal.value = data;
}, '我是糖饼');

Iframe消息

特别说明:回调函数第一个参数为iframe消息window对象

这里创建的iframe页面里可以使用这两个专用方法:
关闭对话框:art.dialog.close()
获取来源页面的window: art.dialog.parent

同域下能够自适应iframe大小,但chrome 浏览器本地运行会认为跨域而无法适应大小

art.dialog.open('iframe.html', {
	title: '我是iframe消息',
    yesFn: function(iframeWin, topWin){
        // iframeWin: 对话框iframe内容的window对象
        // topWin: 对话框所在位置的window对象
        var form = iframeWin.document.getElementById('googleForm'),
            tips = iframeWin.document.getElementById('tips'),
            txt = iframeWin.document.getElementById('googleText'),
            val = document.getElementById('demoInput04'),
            topVal = topWin.document.getElementById('testInput');
            
        if (val) val.value = '关键字:' + txt.value;
        if (topVal) topVal.value = '关键字:' + txt.value;
           
        if (txt.value === '') {
            txt.focus();
            tips.innerHTML = '此项必须填写!';
            return false;
        };
        
        form.submit();
    },
    closeFn: function(){
        alert('close');
    }
});

Ajax HTML

特别说明:第三个参数为ajax缓存开关,默认为true。由于浏览器限制,ajax需要在服务端运行才能正确运行本例子。

art.dialog.load('ajaxContent.html', {
	title: '远程载入HTML片段',
	yesFn: function(topWin){
    	alert('hello world');
    },
	closeFn: function(){
    	alert('close')
    }
}, true);

Ajax JSON

特别说明:这里是用JSON数据+模板引擎拼接HTML代码,推荐此代替常规的iframe

art.dialog.load('json.txt', {
	title: '使用JSON拼接模板',
    tmpl: '\
    <% if (code === 0) { %>\
        <p>当前用户:<a href="<%=web%>" title="<%=web%>"><%=me%></a></p>\
        <p>\
            所有用户:\
            <% for (i = 0; i < users.length; i++) { %>\
                <%=i + 1%>.<%=users[i]%> \
            <% } %>\
        </p>\
    <% } else { %>\
    	<p>哦,服务器出错了,错误代码:<%=code%><p>\
    <% } %>\
    '
}, true);

提示消息

art.dialog.tips('提交成功!', 1);

传统的dialog方法穿越框架

art.dialog({
	content: '我是新来的对话框,请多多关照!',
    window: 'top'
});