Question

我是在我的html页面中动态创建的iframe和点击事件的打印按钮打印iframe的内容但不幸的是它打印整个页面但经过长时间的搜索我发现了一些解决方案，比如在火灾打印事件之前专注于iframe 但它似乎不适用于IE和MS Edge 它适用于Chrome 与我合作的唯一解决方案是打开新窗口并在其中复制iframe outerhtml并在新窗口中加载内容后触发打印事件然后在用户执行打印或取消操作后立即关闭新窗口但这个解决方案看起来并不友好那么在IE和Edge

中打印iframe内容是否有任何解决方案呢？

 <html>
<head>
<title>IFrame Printing Issue</title>

<script type="text/javascript">
  var g_iFrame;

  function onLoad()
  { 
     g_iFrame = document.createElement("iframe");
     g_iFrame.id = "testFrame";
     var style = g_iFrame.style;
     style.border = "1px solid black";
     style.width = "300px";
     style.height = "200px";

     document.body.appendChild(g_iFrame);
  }

  function setIFrameSrc()
  {
     g_iFrame.src = "Test.htm";
  }

  function printIFrameContent()
  {
  window.frames["testFrame"].contentWindow.focus();
  window.frames.testFrame.contentWindow.print();
  }
</script>
</head>

<body onload="onLoad();">
<button type="button" onclick="setIFrameSrc();">Set IFrame Src</button> 
 <br /> 
<button type="button" onclick="printIFrameContent();">Print IFrameContent</button>
<br /> 

 <div style="border: 1px solid black; width: 300px; height: 200px;">
  This is to test printing the content of an IFrame whose src is set dynamically.
</div> 
</body>
</html>

Answer 1

您可以先检查用户代理是否为IE：

function printIFrameContent()
{      
  var ua = window.navigator.userAgent;
  var msie = ua.indexOf ("MSIE ");
  var iframe = document.getElementById("testFrame");

  if (msie > 0) {
      iframe.contentWindow.document.execCommand('print', false, null);
  } else {
      iframe.contentWindow.print();
  }
}

在SO上提到了类似的答案：https://stackoverflow.com/a/19639241/1500851

尝试打印iframe内容，但打印整个页面

1 个答案: