我正在尝试创建一个模式对话框，该对话框具有溢出内容的垂直滚动。出于演示目的，此对话框包含一个锚点和一堆 div（溢出）。这是我的代码：
的HTML
<body>
<div id="dialog">
<a href="javascript:void(null);">blah blah blah</a>
<div>some content to make the dialog scroll appear</div>
<div>some content to make the dialog scroll appear</div>
<div>some content to make the dialog scroll appear</div>
<div>some content to make the dialog scroll appear</div>
<div>some content to make the dialog scroll appear</div>
<div>some content to make the dialog scroll appear</div>
</div>
</body>
jQuery
$(document).ready(function () {
$('#dialog').dialog({
position: 'center',
height: 300,
width: 200,
modal: true
});
});
演示：JS Bin
要重现该问题：
- 向下滚动到对话框底部
- 失去对实际浏览器窗口的关注（转到另一个窗口，单击桌面等）
- 将鼠标悬停在未聚焦的浏览器窗口中的对话框上
- 单击对话框（或只是最小化/最大化您的浏览器窗口）
结果应该是对话框滚动回最顶部的锚标记（“blah blah blah”）。（这可能需要多次尝试在对话框中失去焦点/单击） JS Bin 代码使用的是 jQuery UI 1.10.2，但它也发生在 .3 中。
我相信我的问题可能与这个 SO question类似，但它有点不同，因为我使用的是锚标签......但是，这条线hasFocus.eq(0).focus();是罪魁祸首。当该部分为我执行时，它将我的锚标记作为hasFocus数组中的第一个元素。无论哪种方式，对话框的默认行为都不应该滚动回顶部......它应该保持在原来的位置！
现在，有趣的部分是一旦你拿走modal: true，问题就不再存在了......所以我不确定这是一个错误还是一个“功能”。有人有想法吗？
此外，我已经在 Firefox（多个版本和安全模式）和 IE8 中对此进行了测试。