0

window.open用来创建一个空窗口,然后使用 jquery DOM 操作方法填充它。我想做的一件事是确保新窗口中的所有可用脚本与父窗口中的脚本相同。我还复制了所有样式表,以及父窗口 HEAD 部分中的任何其他数据,所以我决定这样做:

    $(floatingMap.window.document.head).append(
            $("<base>", {"href": location.href})).append(
            $("head").children().clone()));

这首先创建一个<base>标签,确保源文档中的相对 URL 被正确解释,然后从源文档的 head 部分注入所有标签的副本。我可以使用 Chrome 的 DOM 检查器在新窗口中检查注入的对象,一切看起来都不错,但我遇到的问题是脚本没有加载。另一方面,样式表加载良好。有什么想法可以使脚本正确加载吗?

更新:

在一个可能相关的问题中,我发现以下代码有意想不到的结果:

 $(floatingMap.window.document.head).append(
    $("<script>").text("window.opener.childWindowReady()"));

这会导致指定代码在父窗口的上下文中执行,而不是在子窗口的上下文中执行。任何想法为什么会这样?

4

2 回答 2

0

这似乎是一个 jquery 错误。从 jquery 操作中排除脚本标签,然后使用纯 javascript 添加这些标签可以按预期工作:

    var scripts = document.getElementsByTagName("script");

    function loadScript (index)
    {
        if (index == scripts.length) 
            onChildWindowReady ();
        else if (scripts[index].src)
        {
            console.log ("injecting: " + scripts[index].src);
            var inject = document.createElement("script");
            inject.src = scripts[index].src;
            floatingMap.window.document.head.appendChild(inject);
            inject.onload = function () { loadScript (index + 1); };
        }
        else
            loadScript (index + 1);
    }
    loadScript (0);
于 2013-10-13T18:20:18.010 回答
0

除了 document.writeln 之外,还可以动态添加所有内容并执行它们。

例如,

jQuery(document).ready(function(){
    jQuery('body').append("jquery loaded");
    var w = window.open();
    var htmlContent = document.documentElement;
    w.document.writeln("<html>"+htmlContent.innerHTML+"</html>");
    w.document.close();

});

这演示了打开 jsfiddle 结果窗口的克隆,该窗口将包括 jquery 以及 head 中的脚本内容。

http://jsfiddle.net/6Qks8/

于 2013-10-13T18:55:37.263 回答