当jquery对话框打开时，窗口向上滚动
我正在尝试使用jquery 1.4和jquery-ui-1.8rc3.custom.js打开模态jquery对话框
在所有浏览器中，对话框打开都没有问题，但在IE 7和6中，对话框打开后，窗口自动滚动到按钮…我尝试将窗口向上滚动回到模态位置但是非常不一致。 打开模态后使用以下代码行
window.scrollTo($('#selector').dialog('option', 'position')[0],$('#selector').dialog('option', 'position')[1]); 我注意到的一个奇怪的事情是，在我打开模态之后，页面变得巨大……好像一些额外的东西加在底部……它最终滚动到底部。 知道为什么这可能是hapenning
在HTML中
在document.ready
$('#selector').dialog({ bgiframe: true, autoOpen: false, width: 100, height: 100, modal: true, position: 'top' });
在js
$('#selector').dialog('open');
看起来你错过了选择器中的# ：
window.scrollTo($('#selector').dialog('option', 'position')[0], $('#selector').dialog('option', 'position')[1]);
这可能是窗口滚动到左上角的原因。
编辑：我只是看文档和.dialog('option','position')默认值是center 。
position类型：字符串，数组默认值：’center’
指定对话框的显示位置。 可能的值：1）表示视口内位置的单个字符串：’center’，’left’，’right’，’top’，’bottom’。 2）一个数组包含x，y坐标对，从左边视角偏移，视口的顶角（例如[350,100]）3）包含x，y位置字符串值的数组（例如[‘right’，’top’]右上角）。
因此，您可以使用position选项和window.scrollTo()获取返回的文本或数字。 所以试试这个：
var d = $(".ui-dialog").position(); window.scrollTo( d.left , d.top);
如果您使用如下所示的锚标记来触发对话框
open dialog
你会想要添加一个return false; 到onclick属性：
open dialog
这可以防止页面重新加载锚定# ，这会导致它跳转到顶部。
我也在努力解决这个问题。 我没有使用任何主题，所以我没有这个重要的CSS属性：
position:absolute;
我将此添加到我的CSS文件中，现在一切正常：
.ui-widget { position: absolute; }
我有这个问题，因为我正在为我的样式表设置的对话框分配一个类：
position: relative;
这超越了：
position: absolute;
对话框需要。
基本上，确保.ui-dialog类具有：
position: absolute;
并且窗口不应滚动到页面底部，并且不会将额外的垂直空间添加到正文中。
我有一个类似的情况，对话框打开它应该在页面上的位置，但用户被重定向到页面的底部。 基本上，我忘了包含适当的css来匹配jQuery UI JavaScript库。 通过这样做一切都很好。 我想它就是这样的，在jQuery css上的元素上设置了样式，这些样式没有在你自己的css中设置。
为了调试问题所以我不必包含整个jQuery UI css，我创建了两个相同的页面，一个使用jQuery UI css而另一个没有，只是通过Firefox上的Firebug检查了css中的不同之处并添加了这些样式对我的CSS。
希望能帮助到你。 马格
我是如何修理它的：
HTML
...
使用Javascript
function openDialogFunction(parameters) { var topOff = $(window).scrollTop(); //code to open the dialog $(window).scrollTop(topOff); }
我有类似的问题，这就是我解决的问题。 它类似于@bassim解决方案，但它的味道略有不同。
我有相同的锚标签并使用“$（＃anchor-element）.click（function（）{..}。以下是代码片段 –
在jsp中 –
Add comments
在javascript中 –
$( ".open-add-comments" ).click(function(){ var projectId=$(this).attr("project-id"); $( "#add-comment-form" ).dialog({ //width: "auto", width: 800, height: "auto", position: "absolute", maxWidth: 800, minWidth: 300, maxHeight: 400, modal: true, title: "Adding comment for \"${project.name}\" and site \""+siteName+"\" ", open: function(event, ui) { $("#add-comment fieldset textarea").html("").focus(); ............ ..... }, buttons: { "Save": function() { .... some business logic }, Cancel: function() { $( this ).dialog( "close" ); } } }); return false; // -- THIS IS IMPORTANT AND RESOLVED THE ISSUE });
这样就解决了这个问题。 感谢您在此页面中rest，他们提供了很好的指导并帮助解决了这个问题。 荣誉团队。
另一种解决方案是在对话框打开时调用event.preventDefault
$('#demo4').click(function() { $( "#tallContent" ).dialog( "open" ); event.preventDefault(); });