加载iframe而不将其注入DOM

Loading an iframe without injecting it into the DOM

本文关键字：注入 DOM iframe 加载      更新时间：2023-09-26

我基本上遇到了与这个问题相反的问题：如何防止iframe在注入DOM时加载？我希望加载一个未注入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为零。我不知道是否可以将不在DOM中的元素集中，或者这是否是打印所必需的，但我在其他地方看到的代码都在.print()之前有.focus()(我也尝试过使用window.frames['printjob'].print()，但如果iframe还不在窗口中，我怀疑window.frames['printjob']为零：(

正如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秒尝试删除它，但这听起来像是在找麻烦。

附带说明：作为一名用户，我非常喜欢在打印之前先看看我要打印的内容。但如果你有避免这种情况的用例，也许这会有所帮助。

这不是AJAX被发明的原因吗？也许这会有所帮助。

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

相关文章：