Question

感谢this answer，我可以在页面加载时启动fancybox iframe：http://www.casedasole.it/fancybox/A.html

This answer显示了如何在启动iframe的页面中打开其内容以javascript编码的fancybox iframe：http://www.casedasole.it/fancybox/B.html

有没有办法让B做A所做的事情 - 即在页面加载时启动自己？

注意：隐藏的div方法（see here）无法正常工作，因为我需要能够在iframe中打开后进行导航。

Answer 1

只是做：

var myContent = "..."; // html as option "B"

jQuery(document).ready(function ($) {
    $.fancybox({
        // API options as "B"
        // build the iframe
        content: '<iframe id="myFrame" class="fancybox-iframe" frameborder="0" vspace="0" hspace="0" src="about:blank"></iframe>',
        afterShow: function () {
            var oIframe = document.getElementById('myFrame');
            var iframeDoc = (oIframe.contentWindow.document || oIframe.contentDocument);
            iframeDoc.open();
            iframeDoc.write(myContent);
            iframeDoc.close();
        }
    });
}); // ready

参见 JSFIDDLE

注意 myContent变量包含完整 html结构，包括DOCTYPE，<html>，{{ 1}} <head>个部分。虽然它不是强制性的，但它可以让您更好地控制初始（iframed）页面的设置。

另外请注意我的 jsfiddle 我将基本内容（<body>基本结构）与自定义内容（例如html）分开，以达到整洁的目的;）

参考：

选项A：http://jsfiddle.net/8qp0Lr3z/1/
选项B：http://jsfiddle.net/qVrLr/

Fancybox iframe在启动页面上以js编码的内容 - 如何在页面加载时打开？

1 个答案: