元素的可点击区域从 Ipad Safari 上的实际位置向上漂移

Question

我在 Ipad Safari 上使用 ASP .NET 站点时遇到一点问题。我有以下表格：

• A div 覆盖在主窗体之上。
• 在这个 div 中，我有一个带有 4 或 5 个下拉列表的更新面板。
• 每个下拉列表在更改时都会从数据库中提取一些数据并在同一个 div.
上填充某些 gridview

在 PC 上使用 Chrome、FF、IE...，我的网站运行良好。但是在 Ipad Safari 上，我遇到了这个奇怪的问题：

• 用户更改下拉列表后，所有元素的可点击区域有可能会从元素的实际位置向上漂移。
• 例如，当我点击一个按钮时，没有任何反应，如果我想使用那个按钮，我必须点击它上面几十个像素的空白区域。文本区域、单选按钮、...
也是如此
• 所有可点击区域向上漂移的量似乎不是固定的，有时向上漂移数百个像素，而有时仅向上漂移十几个像素，但所有可点击区域总是向上漂移相同的数量。
• 缩小页面 in/zoom 或 select 任何文本框都会将所有可点击区域重置到正确位置。

我正在使用 .NET Framework 4.5，并使用 IOS 8.3 在 Ipad 上进行测试。不幸的是，我无法单独使用 js 和 html 重现它。

Answer 1

我终于找到了这个奇怪问题的答案。显然，当我在叠加层 div 上上下滚动时，我可能也会不小心滚动主窗体。如果我将主窗体与叠加 div 一起滚动，当我单击下拉列表并填充 gridview 时，叠加 div 上的所有可点击区域都会向上移动。我滚动主窗体越多，可点击区域漂移得越多。

我通过向所有下拉列表的 onclick 事件添加以下函数来解决此问题：

function fixClickableDrift() {
    $(window).scrollTop(0);  
}

现在无论我滚动多少主窗体，当我单击下拉列表时，此功能都会将主窗体的位置重置回页面顶部。希望这对以后的人有所帮助。