当前位置: 代码迷 >> Web前端 >> 关于JqueryUI dialog没法正常打开
  详细解决方案

关于JqueryUI dialog没法正常打开

热度:247   发布时间:2013-03-21 10:08:17.0
关于JqueryUI dialog无法正常打开
JqueryUI dialog无法正常打开


     我遇到的问题是这样的:在一个页面有个iframe,iframe能easyUI的Tab点击打开不同的Tab标签。每个标签就是一个子页面。然后我打开了多个子页面,我在其中一个子页面发送一个ajax请求,发送ajax请求后会用使用JqueryUI的dialog打开窗口。  当我在ajax请求会返回结果时,切换Tab子页面,去其他子页面做其他事情。等会再切换Tab过去时,dialog的弹出窗口不见了。

     检查了好几遍,不是弹出窗口没有弹出来,而且是弹出下下面去了。页面也增加了一个滑动条。页面拉长了很多。用IE的页面布局工具查看了一下,dialog的长宽都超过10000px了。查看了下Jquery UI 的源码,发现在取其坐标的时候出问题了,估计其原因是不同body引起的。
修改了一下源码,给了个绝对定位。这是没办法的办法了,具体原因还有待研究解决。
......
$.widget("ui.dialog", {
	options: {
		autoOpen: true,
		buttons: {},
		closeOnEscape: true,
		closeText: 'close',
		dialogClass: '',
		draggable: true,
		hide: null,
		height: 'auto',
		maxHeight: false,
		maxWidth: false,
		minHeight: 150,
		minWidth: 150,
		modal: false,
		position: {
			my: 'center',
			at: 'center',
			collision: 'fit',
			// ensure that the titlebar is never outside the document
			using: function(pos) {
				var topOffset = $(this).css(pos).offset().top;
				if (topOffset < 0) {
					$(this).css('top', pos.top - topOffset);
					// add by sw 2013-3-7  Tab切换引起的弹出窗口无法正常显示,绝对定位
					if((pos.top - topOffset)>1500){
						var browserWidth = document.documentElement.scrollWidth;
						var browserHeight = document.documentElement.scrollHeight;
						$(this).css('top', browserHeight/2-100);
						$(this).css('left', browserWidth/2-200);
					}
					//end
				}
			}
		},
		resizable: true,
		show: null,
		stack: true,
		title: '',
		width: 300,
		zIndex: 1000
	},......
  相关解决方案