无法将样式表/脚本插入到window.open中 [英] Unable to insert stylesheet/script into window.open
问题描述
我已经打了这个问题了一段时间，现在（仍然）无法打印我的div与它的造型。
目前，我的脚本：
$（'＃printMeButton'）click（function（）{
// alert ）;
var data = document.getElementById（'thisPrintableTable'）。outerHTML;
var mywindow = window.open（''，data）;
mywindow.document.write （'< html>< head>< title> Print Me !!!< / title>'）;
// mywindow.document.write（'< link rel =stylesheettype = text / csshref =Site.cssmedia =screen>'）;
mywindow.document.write（'< / head>< body>'）;
mywindow .document.write（data）;
mywindow.document.write（'< / body>< / html>'）;
mywindow.document.close（）;
mywindow.focus（）;
mywindow.print（）;
mywindow.close（）;
return true;
}）; $（document）.ready 中嵌套的
< $ c> function。
当我包含所需的样式表（当前注释掉）时，打印预览中不显示任何内容。
我也有一些脚本对表格的外观有影响，因此，我认为这可能是把这些包含在弹出窗口中的关键。
如何将这个包含在新的弹出窗口中？
有人可以建议一种打印方式吗？
编辑历史记录
- c $ c>< / head>< body>
- 更改
var data拥有outerHTML而不是innerHTML - 尝试打开本地html文件使用window.open与css链接在其中。并使用js将要打印的内容html设置为本地html文件。
这是要打印的页面： -
< html>
< head>
< title>< / title>
< meta http-equiv =Content-Typecontent =text / html; charset = UTF-8>
< link href =test.css =stylesheettype =text / css/>
< script src =jquery.js>< / script>
< / head>
< body>
< div id =print>
< div class =red> TODO写内容< / div>
< / div>
< button id =print_btn>打印< / button>
< script>
$（'＃print_btn'）。click（function（）{
var newWindow = window.open（'print.html'，'_ blank'）;
$（newWindow）.load （function（）{
$（newWindow.document）.find（'body'）。html（$（'＃print'）。html（））;
}）;
} ）
< / script>
< / body>
< / html>
css文件test.css链接到这里，我打开print.html的window.open，test.css也链接在print.html中
现在，在print.html中我会写： -
< html>
< head>
< title>< / title>
< meta http-equiv =Content-Typecontent =text / html; charset = UTF-8>
< link href =test.css =stylesheettype =text / css/>
< / head>
< body>
< / body>
< / html>
I have been fighting this issue for quite some time now, and have been (still) unable to print my div with its styling.
Currently, my script is:
$('#printMeButton').click(function () { //alert("a"); var data = document.getElementById('thisPrintableTable').outerHTML; var mywindow = window.open('', data); mywindow.document.write('<html><head><title>Print Me!!!</title>'); // mywindow.document.write('<link rel="stylesheet" type="text/css" href="Site.css" media="screen">'); mywindow.document.write('</head><body>'); mywindow.document.write(data); mywindow.document.write('</body></html>'); mywindow.document.close(); mywindow.focus(); mywindow.print(); mywindow.close(); return true; });which is nested within a
$(document).readyfunction.When I include the desired stylesheet (currently commented out), Nothing appears in the print preview.
I also have some script that has an effect on the appearance of the table, and, as such, I believe this may hold the key of having these included into the popup window.
How can i include this into the new popup?
Could someone please suggest a way of printing this as it stands?
Edit History
- removed space at end of
</head><body> - Changed
var datato haveouterHTMLinstead ofinnerHTML - Altered Question/details from better understanding of issue
解决方案Try to open a local html file using window.open with css linked within it. And set the content html to be printed to the local html file using js.
Here is the page to be printed:-
<html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <link href="test.css" rel="stylesheet" type="text/css" /> <script src="jquery.js"></script> </head> <body> <div id="print"> <div class="red">TODO write content</div> </div> <button id="print_btn">Print</button> <script> $('#print_btn').click(function(){ var newWindow = window.open('print.html','_blank'); $(newWindow).load(function(){ $(newWindow.document).find('body').html($('#print').html()); }); }) </script> </body> </html>The css file test.css is linked here, and I'm opening print.html at the time of window.open, the test.css is also linked in the print.html
Now, in print.html I'll write:-
<html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <link href="test.css" rel="stylesheet" type="text/css" /> </head> <body> </body> </html>这篇关于无法将样式表/脚本插入到window.open中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
- removed space at end of
