Javascript 如何在完成所有jqueryajax请求后调整iframe的大小

我有一个带有iframe的html文档。父文档和iframe（wordpress博客）中的文档位于同一个域中。iframe会自动调整其加载时的高度事件以适合其内容，如下所示：

<iframe width="100%" height="100%" id="parent-iframe" name="parent-iframe" src="/blog" scrolling="no" onload="this.height=this.contentWindow.document.body.scrollHeight" onresize="this.height=this.contentWindow.document.body.scrollHeight"></iframe>

它很好用。但是现在，这个博客主要是一个带有facebook提要的页面，已经用一个“加载更多”按钮进行了更新，以限制显示的帖子数量。很像一个无限长的卷轴，但有一个按钮

我想要的是能够在“加载更多”按钮上调整父iframe的大小。由于facebook提要是由wordpress插件提供的，并且它时不时会得到更新，所以我不想直接处理它的文件。另外，javascript代码被缩小了，所以我觉得它像jibberish

幸运的是，它还提供了一个后台文本框来包含自定义代码。由于jQuery已经加载，我尝试了以下方法：

jQuery(document).ready(function () {
    jQuery("load-more").click(function () {
        var frame = $('#parent-iframe', window.parent.document);
        var height = jQuery('body').height();
        frame.height(height);
    });
});

jQuery(document).ready(function () {
    jQuery("load-more").click(function () {
            $(document).ajaxStop(function () {
            var frame = $('#parent-iframe', window.parent.document);
            var height = jQuery('body').height();
            frame.height(height);
            $(document).unbind("ajaxStop");
       });
   });
});

它按预期工作，但有一个警告。无论何时触发点击事件，该功能都会在加载新帖子之前执行，因此身高始终落后一步。我可以添加固定数量的像素 但有些职位比其他职位大得多

---

我不经常做这种工作，所以我需要帮助。我在看jQuery延迟对象，但老实说，我有点迷路了。有人能简单地向我解释一下它是如何工作的以及如何修复它的吗？

多亏了@jfriend00的建议，我想我找到了一个可行的解决方案。 由于插件javascript文件已经缩小，而且我不习惯javascript调试，所以我找不到

load more

ajax调用的结尾。 当时我所需要的只是等待所有ajax请求完成。所以我找到了这篇文章并尝试了这个：

jQuery(document).ready(function () {
    jQuery("load-more").click(function () {
        var frame = $('#parent-iframe', window.parent.document);
        var height = jQuery('body').height();
        frame.height(height);
    });
});

jQuery(document).ready(function () {
    jQuery("load-more").click(function () {
            $(document).ajaxStop(function () {
            var frame = $('#parent-iframe', window.parent.document);
            var height = jQuery('body').height();
            frame.height(height);
            $(document).unbind("ajaxStop");
       });
   });
});

现在它起作用了。如果我不能更好地解释我自己，请原谅。正如我所说，我不习惯这样，所以我缺乏合适的术语和概念。如果您对文章标题、细节或标签有任何建议，以便对其他人有用，我很乐意对其进行相应的编辑

它也可以工作，看起来更干净，如下所示：

<iframe width="100%" height="100%" id="parent-iframe" name="parent-iframe" src="/blog" scrolling="no" onload="this.height=this.contentWindow.document.body.scrollHeight" onresize="this.height=this.contentWindow.document.body.scrollHeight"></iframe>

---

子文档jquery

我不确定您想要在这里执行什么…您想要执行上面的工作代码，但需要延迟吗？我不知道这是否有帮助，但这已经存在：@mjw本身不是延迟，而是在“加载更多”按钮功能完成后按顺序执行。@mkaatman谢谢，我会看一看的。但是我还想知道是否以及如何使用jQuery单独完成它。您需要知道

loadmore

按钮中的代码何时完成了工作。因为这不是内容的初始加载，所以它必须是某种Ajax调用。如果它没有公开ajax调用何时完成的任何信息，那么除了轮询内容以查看内容何时被更改（这是一个丑陋的黑客行为）之外，您真的没有什么可以做的了。您可以向我们展示处理“加载更多”按钮的常规代码吗？其中一个问题是，每次单击按钮时，您都会注册一个新的

.ajaxStop（）

处理程序，它们将累积。再次感谢@jfriend00

$（文档）。解除绑定（“ajaxStop”）应该这样做对吗？