使用javascript将父div传递给弹出div答案

【问题标题】：Passing parent div to popup div using javascript使用javascript将父div传递给弹出div
【发布时间】：2011-10-15 18:33:00
【问题描述】：

我正在为客户设计一个页面，我在一个名为“areaToPrint”的 div 中有一个数据库表，我想以某种方式打印它，并且我希望能够对表进行 css 格式。基本思想是使用javascript将'areaToPrint'.innerhtml发送到我的css格式文件printer.php中一个名为'printer'的div。

//我的脚本在主/父页面中

<script>
function printDiv()
{
var divToPrint=document.getElementById('areaToPrint');
var newWin = window.open("printer.php");
newWin.document.getElementById('printer').innerHTML=divToPrint.innerHTML;
newWin.print();
newWin.close();
}
</script>

//Printer.php中的body元素

<body>
<div id="printer"></div>
</body>

我希望areaToPrint 的内容填充弹出的printer.php 中的打印机div。我能够使用类似的东西来完成类似的任务

newWin.document.write(divToPrint.outerHTML)

但我希望能够对 div 内的表格进行 css 格式设置。（通过链接调用javascript）

关于 javascript 错误有什么建议吗？

【问题讨论】：

标签： javascript html innerhtml outerhtml

【解决方案1】：

也许 jQuery 会有所帮助

$(this).parent()
$("someone").css()
$("someone").addClass()

【讨论】：

【解决方案2】：

除非您想使用 JavaScript 动态格式化表格（例如，根据交互更改视觉样式），最简单的方法是在您的 printer.php 视图模板中包含一个样式表。

例如

<html>
    <head>
        <link rel="text/css" media="print" href="css/print.css" />
    </head>
    <body>
        <div id="printer"></div>
    </body>
<html>

【讨论】：

是的，我的打印机就是这样操作的。我只是没有包括头块。我的问题是如何执行 Javascript 并解决打印机 div 问题。
在这种情况下，我不确定您的要求是什么，您的问题是说您想知道如何为其添加 CSS 样式。你能澄清一下吗？
如果我让自己不清楚，我很抱歉。我想在我的主页上获取一个 div 的内容，打开一个新窗口 printer.php 并用该内容填充它的打印机 div！我可以写一个外层HTML，但是我失去了我的css格式。
您不能对内容进行格式化（无论如何都不能通过任何简单的方式）。就像我说的，最简单的方法是在弹出窗口中包含一个样式表，以设置内容的样式。当您插入内容时，它将被样式表设置样式。
感谢您的尝试。但你仍然没有明白我的意思。我知道我可以在 head 块中包含一个 css 文件，但我没有在上面的代码中包含 head 块，因为那是题外话。我的问题仍然是 javascript 以及如何在打印机 DIV 中获取它