访问iFrame中的元素（ie9，Chrome，Firefox）

我在看似简单的任务时遇到了一些麻烦。访问iFrame中的元素（ie9，Chrome，Firefox）

我想将当前url加载到iFrame中。
我需要访问多个div并将其删除。
我需要打印修改后的iFrame。

这是我到目前为止，但我无法访问加载的iFrame中的任何html元素。该iFrame的内容打印如预期，但我需要删除几个div，我拉我的头发试图做：

var newWidth = "1024px"; 
var url = window.location; 
var $iFrame = $('<iframe id="printFrame" style="width:' + newWidth + ' !important;  height:100 !important; border: 1px solid #000000;" name="printFrame"></iframe>'); 

$('#content-area').append($iFrame); 

$iFrame 
    .load(function() { 

    // NEED TO DO THIS IN THE IFRAME DOCUMENT: 
    // $('#content-area').remove(); 
    // CANT FIGURE OUT HOW 


    this.contentWindow.print(); // this prints fine 
    $(this).unbind('load'); 
    }) 
    .attr('src', url);

谢谢！ Ron

来源

2012-10-19 RSH

它应该是在iframe中加载页面的责任，以便通过CSS打印自己的样式。 – jbabey

你为什么要用JavaScript做到这一点？使用打印样式表来隐藏不想打印的元素。

添加一个新的样式表

<link rel="stylesheet" type="text/css" media="print" href="print.css" />

添加要应用print.css

div.noPrint { display : none; }

如果你仍然想用iframe来做到这一点，你需要使用contents()规则访问元素。

var iframeDivs = $iFrame.contents().find("div");

来源

2012-10-19 16:44:25 epascarello

这是一个很长的解释，为什么我不能使用样式表方法，但帮助我了解如何在iFrame加载函数中引用相同的调用： – RSH

您是否看不到最后一行？这就是你如何访问iframe的内容。 – epascarello

display：none不会隐藏div，但会在ie9中打印时留下的空白空间为220px。 – RSH

访问iFrame中的元素（ie9，Chrome，Firefox）

回答

相关问题