33-jqueryUI中的dialog操作

$(function () {
	$('#search_button').button();
		//创建dialog
		$('#reg').dialog({
			//1.外观，title，buttons
			title:'知问注册',
			buttons:{
				'提交':function(){
					alert('提交');
				},
				'取消':function(){
					$(this).dialog('close');
				}
			},
			//2.对话框出现位置,默认为center，其他left，top,right 
			//position:'right top',
			//3.大小选项width,height,minWidth,maxWidth
			width:300,
			//4.视觉选项show:true,show淡入hide淡出,特效blind,slide,
			//show:'slide',
			//hide:'slide',
			//5.行为选项autoOpen:false只创建不显示
			autoOpen:false,
			//6.是否可以移动,可以重新设置大小
			//draggable:false,
			//resizable:false,
			modal:true,//遮罩效果
			//设置关闭文字
			closeText:'关闭',
			
			//dialog的事件
			focus:function(event,ui){
				alert('得到焦点,有两个dialog的时候，在上面的时候点击才会出现alert');
			},
			/*create:function(event,ui){
				alert('只要被创建出来就会执行！');
			},*/
			open:function(event,ui){
				alert('打开的时候才会执行！');
			},
			close:function(event,ui){
				alert('关闭的时候才会执行！');
			},
			//可以做一些确认性的动作
			beforeClose:function(){
				alert('将要关闭的时候执行return false对话框不会被关闭');
				//return false;
			},
			drag:function(event,ui){
				$('#username').html('<span>'+ui.position.top+'   '+ui.position.left+'</span>');
			},
			dragStart:function(){
			$('#username').html('移动开始');
			},
			dragStop:function(){
				$('#username').html('移动结束');
			},
			resize:function(){
				
			},
			resizeStart:function(){
				$('#username').html('拖拽开始');
			},
			resizeStop:function(){
				$('#username').html('拖拽结束');
			}
			
		});
		//单击打开
		$('.login').click(function(){
			$('#reg').dialog('open');
	     });
	
});

<div id="reg" title="会员注册">
	表单区--会员注册
</div>