Colorbox - 在颜色框内容中删除自定义 iframe 时防止父页面重新加载？

Question

Colorbox 提供了将 iframe 作为其内容加载的特定方法，当这种颜色框弹出窗口关闭时，父页面根本不会重新加载或刷新。

但是，在我的用例中，我需要在打开的颜色框内附加/添加自定义 iframe 元素，而不交换颜色框内容。已经打开的颜色框内容纯粹是内联 HTML - 不存在任何 iframe。这个新的自定义 iframe 的内容是一个 ajaxified 评论表单，只有在作为自己的页面加载 - 或在完全限定的 iframe 元素中加载时才有效。

当点击颜色框内容中的链接时，我的函数会在下面添加iframe：

$('#cboxLoadedContent').append('<IFRAME frameborder="0" src="'+url+'" id="loadednode">');

现在我可以让它正常工作了 - IFRAME 被插入，并通过正常的内容加载过程并完美地显示所有内容。

唯一的问题是，一旦我通过使用关闭按钮或单击覆盖点击“退出”这个加载的颜色框，与退出颜色框原生 iframe 内容不同，父/顶部页面突然重新加载！

如何防止这种情况发生？是什么让 colorbox-native iframe 在移除时避免页面刷新，但我添加到 colorbox 内容中的 iframe 会导致父页面在移除时重新加载？

作为参考，我可以将 iframe 内容的页面加载为 colorbox-native iframe，退出时不会导致页面重新加载，因此无论哪种情况，问题都不在于 iframe 的内容- 它必须是 colorbox 删除 colorbox 处理的 iframe 与非 colorbox 处理的 iframe 的方式。

一些猜测：

• 没有“name”属性或没有固定“id”属性会导致问题吗？
• 如果 iframe 包含在没有“src”属性的初始内联 HTML 中，但随后在单击时获得了“src”路径，是否可以避免这些问题？
• 是否有另一种说法来表示“在我正在查看的颜色框中加载此 iframe，而不删除已经存在的 HTML 内容”？

我正在使用（旧版本，因为 Drupal 6 与新版本不兼容）：

• jQuery 1.3.2
• 彩盒 v1.3.18.1 (http://www.jacklmoore.com/colorbox/)

Answer 1

已解决：

使用 colorbox 打开的初始内容是内联 HTML - 使用 colorbox 的“内联”命令（将内容从隐藏容器移动到 colorbox 内容中）。当具有此类内容的颜色框关闭时，颜色框的正常行为是将其移回其原始位置（这是一个 display: none div 容器） - 连同我手动添加到颜色框的所有 HTML 。

因此，当我在将新 HTML 插入其中后关闭颜色框时，颜色框将所有这些内容移回页面上的隐藏容器。当您移动 iframe 时，它​​自然会重新加载其内容。 （拍了拍额头）。

因此，实际的解决方案只涉及在 colorbox 继续并将其 HTML 内容返回到其原始位置之前强制删除（）任何一开始不存在的 iframe：

$(document).bind('cbox_cleanup', function(){
    $('iframe').remove(); // Remove all iframes, or else colorbox inline moves them to original location with HTML content, triggering another load on it
    console.log('Done killing iFrame... moving contents back.');

我敢肯定，这是一个晦涩难懂的用例，但希望它能帮助那些混合 iframe 和内联颜色框内容的人；）