弹出窗口文档及演示页面

BasePopBox

弹出窗口抽象类,不能实例化

BasePopBox(options);

参数:

  1. options - (object)可配置参数

options = {
	custombtns: [ //自定义按钮
		{
			name: '示例按钮',
			func: function(){
				//TODO:your code
				this.close();
			}[,	style: 'dkit-btn-positive']
		}
	],
	title: 'message title', //自定义标题
	width: '', //宽度,数值
	height: '' //高度,数值,可以为'fill_parent'用于自适应窗口大小
	dragable: true, //是否可拖动
	isBlock: true //是否有覆盖层
};

Dialog PopBox

普通提示框,默认状态无任何按钮。内容区域可以用于显示html内容。传入的参数可以为一个id或者html字符串,或者是一个HTML DOM对象

AlertBox(content[, options]);

参数:

  1. content - (string)HTML DOM id,或者HTML字符串,或者HTML DOM对象
  2. options - (object, optional)可配置参数

示例:

content参数为HTML DOM id。这里传入的是一个简单的创建用户的表单示例。

var dialogBox = new DialogBox('t-window', {custombtns: [
	{
		name: '创建用户',
		func: function(){
			//this is a custom button event 
			var username = dkit.$('username').value;
			var passwd = dkit.$('passwd').value;
			var repasswd = dkit.$('repasswd').value;
			
			new AlertBox('用户名:' + username + ' 密码:' + passwd + ' 重复密码:' + repasswd).show();
			
			this.close();
		},
		style: 'dkit-btn-positive'
	},
	{
		name: '取消',
		func: function(){
			this.close();
		},
		style: 'dkit-btn-negative'
	}
], title: '创建用户'});
		

content参数为HTML字符串

var dialogBox1 = new DialogBox('<div id="test" style="width:100px;height:100px;background:#f90;color:#fff;">Hello</div>', {
	title: 'HTML字符串参数',
	width: 500,
	height: 400
});
		

Alert PopBox

警告框,默认只有确定按钮

AlertBox(message[, options]);

参数:

  1. message - (string)提示框中显示的提示信息
  2. options - (object, optional)可配置参数

方法:show

show([message])

参数:

  1. message - (string, optional)提示框中显示的提示信息,可选参数,当为空时显示构造参数中的message

示例:

new AlertBox('这是一个Alert Popbox实例').show();

Confirm PopBox

确认提示框,包括确定和取消按钮,会根据用户的点击触发不同的事件

var confirmBox = new ConfirmBox(message[, options]);

参数:

  1. message - (string)提示框中显示的提示信息
  2. options - (object, optional)可配置参数

方法:show

show(positiveEvent, negativeEvent)

参数:

  1. positiveEvent - (Function, optional)当用户点击确定时触发的事件
  2. negativeEvent - (Function, optional)当用户点击取消时触发的事件

示例:

var alertBox = new AlertBox('这是一个Alert Popbox实例', {title: '提示信息'});
var confirmBox = new ConfirmBox('想要你就说嘛,你不说我怎么知道你想要?');
confirmBox.show(function(){
	alertBox.show('想要?你说了我才知道你想要嘛<br />你点击了确定按钮');
}, function(){
	alertBox.show('不想要?你说了我才知道你不想要嘛<br />你点击了取消按钮');
});
		

Toast PopBox

会自动消失的提示框,默认持续时间3秒钟。默认不显示半透明覆盖层,不显示标题

ToastBox(message[, duration[, options]]);

参数:

  1. message - (string)提示框中显示的提示信息
  2. duration - (int, optional)持续时间
  3. options - (object, optional)可配置参数

示例:

new ToastBox('这是一个Toast Popbox实例,本窗口会持续3秒', 3000).show();

Frame PopBox

会在弹出的窗口中显示一个iFrame

FrameBox(url[, options]);

参数:

  1. url - (string)iframe的地址
  2. options - (object, optional)可配置参数

示例:

new FrameBox('http://www.dklogs.net').show();