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 },......