加载iframe而不将其注入DOM

Question

我对这个问题基本上有相反的问题： 如何在注入DOM时阻止iframe加载？ 我希望加载一个未注入DOM的IFRAME元素。

我试图通过javascript打印页面。 目标是避免导航链接，发出打印命令和导航回来。

我有jQuery可供我使用。

// fake table that illustrates pertanent DOM
<table class=diary><tr><td data-job=12345 contextmenu=job_menu><a href=/jobs/12345>view job 12345</a></table>

// real code
<menu type="context" id="job_menu">
    <menuitem label="Print Job" onclick="PrintJob(); return false;"></menuitem>
</menu>
<script type="text/javascript">
    var target = null;

    function PrintJob()
    {
        var job_no = $(target).data('job');
        if(job_no > 0) {
            $('<iframe name="printjob" src="/jobs/'+job_no+'">').load(function () {
                this.focus();
                this.print();
            })
            .trigger('load');
        }
    }

    $('.diary').bind('contextmenu', function (ev) {
        var td = ev.target;
        while(td && td.nodeName != 'TD')
            td = td.parentNode;
        target = td;
    });
</script>

问题是在生成的IFRAME元素上调用.trigger('load')不会在src属性URL上引发GET请求。 我希望首先调用默认处理程序，然后我的附加处理程序将触发，并打印iframe的内容，但我的加载处理程序只是立即被调用。

我无法将打印调用附加到iframe的contentDocument.onready事件，因为在框架加载之前， contentDocument为nil。 我不知道你是否可以将一个元素集中在DOM中，或者是否需要打印，但是我在别处看到的代码都有.focus() .print() （我也试过使用window.frames['printjob'].print() ，但我怀疑如果iframe还没在窗口中， window.frames['printjob']是nil :)

Answer 1

正如Tom van der Woerdt所说， iframe将不会加载，除非您将其添加到DOM。

但这并不意味着它必须加载到用户可以看到的任何地方：

$('<iframe name="printjob" src="/jobs/'+job_no+'">')
    .load(function() {
        this.focus();
        this.print();
    })
    .css({position: "absolute", left: "-10000px", top: "0px"})
    .appendTo(document.body);

实例 （不打印）

诀窍是弄清楚何时将其移除。 您可以尝试在收到load事件后X秒将其删除，但这听起来像是在寻找麻烦。

---

旁注：作为用户，我非常希望在打印之前看到我要打印的内容。 但是如果你有一个避免这种情况的用例，也许这会有所帮助。

Answer 2

这不是为什么AJAX被发明的原因吗？ 也许这可能有所帮助。

要回答你的实际问题：你做不到。 如果不将其插入DOM，则不会加载<iframe> 。