Bootstrap modal pop 正在成为 Iframe 的顶部

Question

我有一个包含 iframe 的应用程序，它在单击按钮时打开引导模式弹出窗口，我面临的问题是弹出窗口粘在 iframe 容器的顶部，而不是相对于打开它的元素，当我独立打开它时，模式弹出窗口工作正常 iframe 应用程序作为独立应用程序。我正在使用

帧调整器

jquery库也可以调整Iframe的大小。

Answer 1

我通过使用 windows.postMessage(( 和 window.addEventListener(( 功能修复了它，我使用以下代码计算了父应用程序上的顶部偏移量和当前滚动位置：

window.addEventListener('scroll', function (event) {
var myIframe = document.querySelector('#wizardIframe');
var topOffset = myIframe.getBoundingClientRect().top + window.scrollY;
var currentScroll = document.scrollingElement.scrollTop;
myIframe.contentWindow.postMessage(topOffset + ':' + currentScroll, '*');
});

在Iframe应用程序中，使用以下代码来获取这些值，并使用它们将填充设置为在单击按钮时弹出的模式弹出窗口，该按钮打开它：

window.addEventListener('message', function (event) {
var messageContent = event.data.split(':');
var topOffset = messageContent[0];
var currentScroll = messageContent[1];
$('#topOffset').val(topOffset);
$('#currentScroll').val(currentScroll);
});