jquery模态防止滚动和防止移动回到页面顶部的模态打开

Question

有两个问题都有独立的详细记录，但解决方案似乎是相互排斥的。

第一个是，当我们打开一个模态，我们希望能够阻止屏幕滚动，这是通过做类似的事情来防止:禁用浏览器滚动，而jQuery UI模态对话框是打开

还有第二个问题，那就是当模态打开时，屏幕被迫滚动回页面顶部，这可以通过使用以下方法来防止:

。要解决第一个问题，可以在body CSS中添加以下内容:

overflow:hidden;

要解决第二个问题，可以在body CSS中添加以下内容:

overflow:visible; 

我面临的问题是我希望两者都为真。当模态打开时，我希望禁用滚动，并且我希望页面冻结在用户滚动到的位置，而不是跳回到顶部。这两种解决方案都不允许同时进行这两种操作。

有人知道同时解决这两个问题的方法吗?

Answer 1

我的解决方案:防止滚动。当打开对话框时，向主体添加一个类，如:

.modal-open {
    overflow: hidden;
}

并在关闭对话框时移除类。

防止顶部移动。在jquery中，在打开对话框的函数中，添加preventDefault