0

我正在使用 datables 插件在我的网络应用程序上绘制表格。

但问题就在这里。

我有一个打印按钮，它调用我这个功能：

function printHTML(clonedDive){
        var iframe = document.createElement("iframe");
        document.body.appendChild(iframe);
    iframe.contentWindow.onunload = function(){
            $("#submenu").show("fast");
            $(".content-secondary").animate({
                             width: '15%'
                         });

            $(".content-primary").animate({
                             width: '83%'
                         });     
     };
      iframe.contentWindow.document.body.appendChild(clonedDive);
      iframe.contentWindow.print();

      document.body.removeChild(iframe); 
}

这就是我调用这个函数的方式：

printHTML( document.getElementById("results").cloneNode(true));

现在resultsdiv 看起来像这样：

<div id="results">
<table id="stops" width="100%" border="1" cellspacing="2" cellpadding="5" >
                <thead>
                    <tr class="even">

                    </tr>
                </thead>

                      <tbody>
                      </tbody>

                     </table>
                     </br>

                     <hr>

                     <p id="title"><b>Map</b></p>
                     <div id="map_find">

                     </div>
</div>

所以表格是这样工作的：当您单击行时，该行被突出显示并显示地图。所以当我点击打印按钮时出现问题。

在打印预览中，我可以看到表格，但未突出显示该行，也未显示 Google 地图。似乎它向我展示了首先初始化的 div 并且没有突出显示的行并且没有显示谷歌地图。

我能做些什么？

4

1 回答 1

1

你考虑过改用@media types吗？

@media print
{
  *{
     visibility: hidden;
  }
  #results{
     visibility: visible;
  }
}

您可以设置您不想打印的所有内容visibility: hidden以及您想打印的任何内容的可见性visibility: visible。

然后点击你会打电话：

window.print()

媒体类型示例

没有媒体类型的示例

于 2012-10-09T19:16:24.473 回答