打开模式对话框时可见2个滚动条
[英]2 Scrollbars visible when I open a modal dialog
问题描述
We have a baffling issue whereby when we try to open a modal dialog box from a parent page it opens with 2 vertical scrollbars next to each other. 
我们有一个莫名其妙的问题，当我们尝试从父页面打开模式对话框时，它会打开，并且两个垂直滚动条彼此相邻。 One controls the modal box, the other one controls the main page behind it. 一个控制模式框，另一控制模式框后面的主页。
To have 2 scrollbars is not ideal and have tried to implement a solution for this. 具有2个滚动条并不理想，并且已尝试为此实现解决方案。 We added some javascript in the dialog box page which would set the style to overflow:hidden when the modal dialog is open. 我们在对话框页面中添加了一些JavaScript，可在打开模式对话框时将样式设置为“溢出：隐藏”。
<script>
function myOnLoad() {
window.parent.$('body').css('overflow', 'hidden');
}
and used.... 并使用...
<body onload="myOnLoad()">
This works and effectively removes the scrollbar in the page behind it (ie it does what it should) however we also want to set the overflow back to 'auto' when the modal dialog is closed… 这有效并有效地删除了其后面页面中的滚动条（即，它做了应有的操作），但是我们还希望在模式对话框关闭时将溢出设置回“自动”。
We have done this by adding this code.. 我们通过添加此代码来完成此操作。
<script type="text/javascript">
// close Modal
$("#close").click(function () {
window.parent.$('body').css('overflow', 'auto');
window.parent.$("iframe").attr('src', '');
window.parent.$(".modalDialog").removeClass('show');
});
However this does not seem to work as the modal dialog closes but the scrollbar is still hidden on the main page. 但是，这在模态对话框关闭时似乎不起作用，但是滚动条仍隐藏在主页上。 Can anyone tell me what I might be doing wrong here? 谁能告诉我在这里我可能做错了什么？ I have tried different overflow properties but nothing seems to work 我尝试了不同的溢出属性，但似乎无济于事
3 个解决方案
解决方案1
0 2015-02-26 15:35:26
I think that using window.parent might be the problem since this refers to the parent of the iframe wich is gone. 我认为使用window.parent可能是问题所在，因为这指的是iframe的父级不复存在。 or something like that. 或类似的东西。 just use jquery 只是使用jQuery
you can try by just getting the body directly $("body"), asuming you are getting that click function to fire. 您可以尝试通过直接获取主体$（“ body”）来进行假设，假设您正在触发点击功能。
edit: i see this has been mentioned above 编辑：我看到这已在上面提到
解决方案2
0 已采纳 2015-02-26 15:42:41
Ok try this, I think your page is reloading on click and thus executing your onload: 好的，尝试一下，我认为您的页面在点击时会重新加载，从而执行onload：
$("#close").click(function (e) {
e.preventDefault();
window.parent.$('body').css('overflow', 'auto');
window.parent.$("iframe").attr('src', '');
window.parent.$(".modalDialog").removeClass('show');
});
解决方案3
-1 2015-03-31 06:37:26
Add style to body as 为身体添加样式
body
{
padding-right:0px !important;
overflow-y:hidden !important;
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.