0

我尝试使用 javascript 打印网页。但是 window.open() 没有加载同一个文件的样式表:(

这是我的 javascript 代码

function Print() {
    printWindow = window.open("", "mywindow", "location=1,status=1,scrollbars=1,width=600,height=600");
    printWindow.document.write("<div style='width:100%;'>");
    printWindow.document.write("<input type='button' id='btnPrint' value='Print' style='width:100px' onclick='window.print()' />");
    printWindow.document.write("<input type='button' id='btnCancel' value='Cancel' style='width:100px' onclick='window.close()' />");
    printWindow.document.write("<select id='cboprintSize' onchange='document.getElementById(\"divContainer\").style.width = document.getElementById(\"cboprintSize\").value + \"px\";'><option value=\"300\">A4</option><option value=\"500\">A5</option></select>");
    printWindow.document.write("<div id='divContainer' style='width:500; height:700; background-color:white'>");
    printWindow.document.write("<table width='100%'><tr><td>");
    printWindow.document.write(document.getElementById('printForm').innerHTML);
    printWindow.document.write("</td></tr><table>");
    printWindow.document.write("</div>");
    printWindow.document.write("</div>");
    printWindow.document.close();
    printWindow.focus();
}

这是asp.net表格

<input type="button" id="btnCall" onclick="Print()" value="Print" />

<form runat="server" id="printForm">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td colspan="3">
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
                <tr>
                    <td>
                    <img src="images/incident1.png" alt="First Line Incident" title="First Line Incident" align="absmiddle" class="cardIcon"  border="0">
                    </td><td width="100%"><span class="title">&nbsp;PRI1307-006</span></td>
                    <td align="right" nowrap>
                    <a href="#" id="public_edit">
                    <span class="value">
                    <img src="images/edit.png" class="iconNavBar" style="border: 0px;" title="Edit" width="24" height="24"></span>
                    </a>
                    <a href="#" dynamicMenu="print"  target="_blank">
                        <span class="value">
                        <img src="images/icon_printable_version.png" class="iconNavBar" style="border: 0px;" title="Printable version" width="24" height="24">
                        </span></a></td>
                </tr>
            </table>
</form>
4

1 回答 1

1

您正在新窗口中创建文档。父页面的样式表无法加载，因为它是新窗口中的新页面。

您可以做的是在新窗口中创建文档时，创建完整的 html 链接您的外部样式表：

printWindow.document.write("<html><head>");
printWindow.document.write("<link href='style.css' type='text/css' rel='stylesheet' />");
printWindow.document.write("</head><body>");
...
printWindow.document.write("<div style='width:100%;'>");
...
printWindow.document.write("</body></html>");
printWindow.document.close();
于 2013-08-02T10:26:09.880 回答